1. #1
    Ext User
    Join Date
    Mar 2007
    Posts
    12
    Vote Rating
    0
    kinky_lizzard is on a distinguished road

      0  

    Default Dynamic Columns for Grid

    Dynamic Columns for Grid


    Hi,
    I am trying to render a grid the columns for which are user/server modifiable (stored as user preferences), hence i cannot have a column model like the one defined in the grid example. e.g.

    Code:
     
    var colModel = new YAHOO.ext.grid.DefaultColumnModel([
    			{header: "Author", width: 120, sortable: true}, 
    			{header: "Title", width: 180, sortable: true}, 
    			{header: "Manufacturer", width: 115, sortable: true}, 
    			{header: "Product Group", width: 100, sortable: true}
    		]);
    Instead i have a xml that defines the column headers that i need to display. I create an array for each individual column config e.g.
    Code:
    for(var l = 0; l < colHeaders.length; l++){
     var tempCol;
     if(l == 0){
    	tempCol ='{header:"'+colHeaders[l].firstChild.nodeValue+'", width: 30}';
     }
     else{
    	tempCol ='{header:"'+colHeaders[l].firstChild.nodeValue+'", width:150}';				
     }
     columnHeaders[l] = tempCol;
    }
    var colModel = new YAHOO.ext.grid.DefaultColumnModel(columnHeaders);
    However on doing so the rendereres are not activated, neither is the column header text visible. However the number of columns is being rendered right.

    I would really appreciate if someone can point me in the right direction.
    Thanks a lot!

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,496
    Vote Rating
    44
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You're creating an Array of strings, not an Array of column config objects.

  3. #3
    Ext User
    Join Date
    Mar 2007
    Posts
    9
    Vote Rating
    0
    seanfell is on a distinguished road

      0  

    Default Re: Dynamic Columns for Grid

    Re: Dynamic Columns for Grid


    I'm looking at doing exactly the same thing kinky_lizzard...
    If you get it working, any chance you could post the code here
    It would be very much appreciatedbe

  4. #4
    Ext User
    Join Date
    Mar 2007
    Posts
    12
    Vote Rating
    0
    kinky_lizzard is on a distinguished road

      0  

    Default


    Thanks Animal (Wonder y they call u that ) :roll:
    i got it working with the following piece of code
    Code:
    var columnHeaders = new Array();
    for(var l = 0; l < colHeaders.length; l++){
    	var columnConfig = new Object();
    	columnConfig.header = colHeaders[l].firstChild.nodeValue;
    	if(l == 0){
    		columnConfig.width = 30;	
    	}
    	else{
    		columnConfig.width = 150;
    		
    	}
    	columnHeaders[l] = columnConfig;
    }
    var colModel = new YAHOO.ext.grid.DefaultColumnModel(columnHeaders);
    Cheers!

  5. #5
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,496
    Vote Rating
    44
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    or

    Code:
    var columnHeaders = [];
    for(var l = 0; l < colHeaders.length; l++){
       columnHeaders.push({width: (l == 0) ? 30 : 150, header: colHeaders[l].firstChild.nodeValue});
    }
    var colModel = new YAHOO.ext.grid.DefaultColumnModel(columnHeaders);
    (Growl!)

  6. #6
    Ext User
    Join Date
    Mar 2007
    Posts
    12
    Vote Rating
    0
    kinky_lizzard is on a distinguished road

      0  

    Default


    on the same note how can i apply renderer on the columns:
    attempts like
    Code:
    var columnHeaders = [];
    for(var l = 0; l < colHeaders.length; l++){
       columnHeaders.push({width: (l == 0) ? 30 : 150, header: colHeaders[l].firstChild.nodeValue, renderer: imageRenderer});
    }
    var colModel = new YAHOO.ext.grid.DefaultColumnModel(columnHeaders);
    leads to the grid not being displayed at all, also the following alternative does not work

    Code:
    var columnHeaders = [];
    for(var l = 0; l < colHeaders.length; l++){
       columnHeaders.push({width: (l == 0) ? 30 : 150, header: colHeaders[l].firstChild.nodeValue});
    }
    var colModel = new YAHOO.ext.grid.DefaultColumnModel(columnHeaders); 
    colModel.setRenderer(0, imageRenderer);
    Enlighten me please!

  7. #7
    Ext User
    Join Date
    Mar 2007
    Posts
    12
    Vote Rating
    0
    kinky_lizzard is on a distinguished road

      0  

    Default


    Oops, mebbe i should look at the code more closely than shooting off my mouth. Lesson learnt.
    Actually the renderer function has to be defined in the function that spans the grid, mine was not (it was defined inside an 'if' check)
    Apologies :oops:

  8. #8
    Ext User
    Join Date
    May 2010
    Posts
    1
    Vote Rating
    0
    kushal179 is on a distinguished road

      0  

    Default


    Can ths dynamic grid works with json reader?what are changes i have to make in my json reader and grid.

    Thanks & regards

Similar Threads

  1. Dynamic grid columns?
    By SteveEisner in forum Ext 1.x: Help & Discussion
    Replies: 37
    Last Post: 16 Dec 2013, 11:52 AM
  2. Max columns limitation in grid?
    By jarrod in forum Ext 1.x: Bugs
    Replies: 9
    Last Post: 26 Jun 2010, 4:52 AM
  3. Grid - Double Header Columns
    By FuryVII in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 23 Feb 2007, 7:21 AM
  4. Nested Grid Columns
    By dlibby00 in forum Community Discussion
    Replies: 4
    Last Post: 29 Jan 2007, 9:53 AM

Thread Participants: 3