Results 1 to 3 of 3

Thread: Forcing SubSort on click of Grid header?

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Sencha Premium Member
    Join Date
    Nov 2012
    Vote Rating

    Default Forcing SubSort on click of Grid header?

    I'm new to ExtJs, so forgive me if I don't have all the jargon down.

    I've got a grid (Ext.grid.Panel) and want the columns to be sortable. Simple enough. However, one of the columns is a date column, and no matter what column the user clicks on, I want to FORCE a sub-sort on the date column.

    For instance: If I click on the "name" column, it sorts the grid by name, ascending. But I want to make it sort by name asc / date desc.

    I've tried numerous ideas I've found online, and I've come close, but nothing seems to work exactly. If I intercept the headerclick event and call grid.sort() manually, it either is ignoring my call, or is re-sorting by the just the single clicked column after my call.

    If I set sortable to false, I can still call the sort in the headerclick event, but then I lose the visible sort direction triangle in the header row (which I still want).

    Can anyone help?? I'm getting desperate! Thanks.

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Gainesville, FL
    Vote Rating


    Using the UI, it's only going to be single sort.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2

    Think my support is good? Get more personalized support via a support subscription.

    Need more help with your app? Hire Sencha Services

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    Nov 2012
    Vote Rating

    Default Working now

    Actually, I figured it out. In a nutshell, I overrode the doSort method for each column I defined with a function that does the sort with my extra sorter (subsort column) tacked on.

    for instance, for my first column, called "Poster", if the user clicks the header, this happens:

    doSort: function (state) {           
                     var g = this.up('grid');
                     var ds =;
                                 property: 'Poster',
                                 direction: state
                     }, {             
                                 property: 'Date',
                                 direction: 'DESC'
    It sorts by "Poster" in whatever the current direction should be, AND subsorts by the "Date" column descending.

    I'll try to put together a simple example on when I get a chance and share it here. Hopefully this will help others.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts