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

      0  

    Default Sort by hidden grid column

    Sort by hidden grid column


    Hello,

    I have got a question about custom sorting a grid.
    For better seaching data with a filter line I split an element in 3 parts:
    PHP Code:
    var cm = new Ext.grid.ColumnModel( {
            
    columns:
        [{
            
    headerT,
            
    dataIndex'TNr',
            
    hiddentrue
          
    {
            
    headerT1,
            
    dataIndex'TNr1',
            
    sortabletrue
          
    },{
            
    headerT2,
            
    dataIndex'TNr2'
          
    },{
            
    headerT3,
            
    dataIndex'TNr3'
          
    }]
        }); 
    To sort the grid this elements should be sorted internally using entries of the first (hidden) column.

    If I use the following code, the data is sorted correctly but the sort icon is set to the hidden column.
    PHP Code:
    store.on('datachanged',function(){
            if ( 
    store.getSortState() && store.getSortState()['field'] != 'TNr' )
            {
                
    store.sort'TNr'store.getSortState()['direction'] );
            }
        }) 
    I read a hint to a MixedCollection in a forum post but I didn't find a way to use the sort function of it.

    My question in summary:
    I want to hide a column that contains the sorting data. If I click on the header of a viewable column that contains a part of this data, the data should be sorted by the hidden column and the sort icon should by displayed on the viewable column.
    Ho can I do this?

    Best reagards

    Mirko

  2. #2
    Sencha User
    Join Date
    Nov 2010
    Posts
    40
    Vote Rating
    0
    b3f3 is on a distinguished road

      0  

    Default


    Quote Originally Posted by Skippy1988 View Post
    My question in summary:
    I want to hide a column that contains the sorting data. If I click on the header of a viewable column that contains a part of this data, the data should be sorted by the hidden column and the sort icon should by displayed on the viewable column.
    Ho can I do this?
    I up this thread cause I need the same thing too.
    Thanks

  3. #3
    Sencha User darthwes's Avatar
    Join Date
    Mar 2010
    Posts
    633
    Vote Rating
    -13
    darthwes can only hope to improve

      0  

    Default


    OK, I thought this was obvious at first, but I understand now that it's a bit more complex. It's still not bad, though. Take a look @
    Code:
    listeners: {
    	'headerclick': function(myGrid, myCol, myEvt) {
    		var cm = myGrid.getColumnModel();
    		//get col def
    		var col = cm.getColumnById(cm.getColumnId(myCol));
    		if(Ext.isDefined(col.sortAs)) {
    			var store = myGrid.store;
    			var cState = store.getSortState();
    			var nState = {
    				field: cm.getDataIndex(myCol),
    				direction: 'ASC'
    			};
    			//flip asc to desc and back on multiple clicks
    			if(Ext.isDefined(cState)) {
    				if(cState.field == nState.field) {
    					nState.direction = (cState.direction == 'DESC' ? 'ASC' : 'DESC');
    				}
    			}
    			store.sort(col.sortAs, nState.direction);
    			myGrid.getView().updateSortIcon(myCol, nState.direction);
    			store.sortInfo = nState;
    			return false;
    		}
    	}
    },
    colModel: new Ext.grid.ColumnModel({
    	defaults: {
    		width: 120,
    		sortable: true
    	},
    	columns: [
    		{dataIndex: 'fieldLabel', header: 'Label'},
    		{dataIndex: 'value', header: "Value", sortAs: 't1'},
    		{dataIndex: 't1', type: 'int', header: "Veloci", sortAs: 't2'},
    		{dataIndex: 't2', type: 'int', header: "Raptor", hidden: true}
    	]
    }),
    Like a friggin glove, no?
    Wes

  4. #4
    Sencha User
    Join Date
    Nov 2010
    Posts
    40
    Vote Rating
    0
    b3f3 is on a distinguished road

      0  

    Default


    Quote Originally Posted by darthwes View Post
    Like a friggin glove, no?
    Comme un gant putain, oui !
    Like a friggin glove, yes !
    Thank you very much darthwes !

  5. #5
    Sencha User
    Join Date
    Nov 2010
    Posts
    40
    Vote Rating
    0
    b3f3 is on a distinguished road

      0  

    Default


    ... but... in my JsonStore, I have remoteSort: true and I use a PagingToolbar.
    Your function sort the store.
    Do you have a solution?

  6. #6
    Sencha User
    Join Date
    Nov 2010
    Posts
    40
    Vote Rating
    0
    b3f3 is on a distinguished road

      0  

    Default


    In fact, with the PagingToolbar, when I navigate on the next page, the sort is not preserved.

  7. #7
    Sencha User darthwes's Avatar
    Join Date
    Mar 2010
    Posts
    633
    Vote Rating
    -13
    darthwes can only hope to improve

      0  

    Default


    Bonne.

    Un: Without paging, the solution should work, the call to store.sort will use the store's defined "remoteSort" property to determine where to sort. See Ext.data.Store.Sort.

    Deux: Paging. Just move the logic over to the store. Let the store's fields have sortAs on them. And decide how to sort in the store. That's a much more appropriate solution.

    Trois: If remoteSort is set as true, then I don't see why it wouldn't work, granted it's not a perfect solution (overriding the store is).

    Service!
    Wes

  8. #8
    Ext User
    Join Date
    Apr 2010
    Posts
    8
    Vote Rating
    0
    Skippy1988 is on a distinguished road

      0  

    Default


    Hi,

    the solution for my questions at the threads start is the following:

    PHP Code:
    var cm = new Ext.grid.ColumnModel( {
        
    columns: [{
            
    dataIndex'tnr1'
          
    },{
            
    dataIndex'tnr2',
            
    sortablefalse
          
    },{
            
    dataIndex'tnr3'
            
    sortablefalse
          
    },{
            
    dataIndex'tnr4',
            
    sortablefalse
          
    },{
            
    dataIndex'tnr5',
            
    sortablefalse
          
    } (...)
      ],
      
    defaultSortabletrue
    } );

    var 
    store = new Ext.data.Store( {
      
    reader    : new Ext.data.XmlReader( {
        
    record       'row',
        
    totalProperty'total'
      
    },[
        {
    name'teile_sort'type'string'},
        {
    name'tnr1'type'string'},
        {
    name'tnr2'type'string'},
        {
    name'tnr3'type'string'},
        {
    name'tnr4'type'string'},
        {
    name'tnr5'type'string'}
      ] ),
      
    remoteSorttrue
    } );
    store.on'beforeload', function( storeoptions ) {
        if ( 
    options.params.sort == 'tnr1' )
        {
            
    options.params.sort 'teile_sort';
        }
    } );
    store.on'load', function( storerecordsoptions ) {
        if ( 
    options.params.sort == 'teile_sort' )
        {
            var 
    sc grid.getView().sortClasses;
            var 
    hds grid.getView().mainHd.select'td' ).removeClasssc );
            
    hds.item).addClasssc[options.params.dir == 'DESC' 0] );
            for ( var 
    i=1i<=4i++ )
            {
                
    hds.item).addClass'sort' );
            }
        }
    } );

    var 
    grid = new Ext.grid.GridPanel( {
        
    cmcm,
        
    storestore,
        
    viewConfig: {
            
    sortClasses: ['sort-asc','sort-desc','sort']
        }
    } ); 
    sort.JPG

    Only the first of the five columns is sortable. If this one is clicked, the data set will be sorted by the internally data field 'teile_sort'. Additionally the first column gets the default sort class, the other 4 columns gets a new class with the same background colour but without a sorting arrow.

    Best regards

    Mirko

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar