4

I have copied the example on the grid sortData http://w2ui.com/web/docs/w2grid.sortData and added sortable:true to lname, but the grid does not sort until I click the header. What am I doing wrong.

Here is the jsfiddle: http://jsfiddle.net/snwaw16v/

$(function () {
    $('#grid').w2grid({
    name    : 'grid',
    columns: [                
        { field: 'recid', caption: 'ID', size: '50px' },
        { field: 'lname', caption: 'Last Name', size: '30%', sortable: true },
        { field: 'fname', caption: 'First Name', size: '30%' },
        { field: 'email', caption: 'Email', size: '40%' },
        { field: 'sdate', caption: 'End Date', size: '120px' }
    ],
    records: [
        { recid: 1, fname: 'John', lname: 'doe', email: 'vitali@gmail.com', sdate: '1/3/2012' },
        { recid: 2, fname: 'Stuart', lname: 'Motzart', email: 'jdoe@gmail.com', sdate: '2/4/2012' },
        { recid: 3, fname: 'Jin', lname: 'Franson', email: 'jdoe@gmail.com', sdate: '4/23/2012' },
        { recid: 4, fname: 'Susan', lname: 'Ottie', email: 'jdoe@gmail.com', sdate: '5/3/2012' },
        { recid: 5, fname: 'Kelly', lname: 'Silver', email: 'jdoe@gmail.com', sdate: '4/3/2012' },
        { recid: 6, fname: 'Francis', lname: 'Gatos', email: 'vitali@gmail.com', sdate: '2/5/2012' }
    ],
    sortData: [
        { field: 'lname', direction: 'asc' }
    ]
});
});
Maher
  • 481
  • 1
  • 6
  • 12

2 Answers2

1

You can sort the grid on render using sort method with the onRender event.

You may add this to your grid object :

onRender: function(event){
    this.sort('lname', 'asc');
}
Delforge
  • 792
  • 7
  • 17
1
gridData = $('#grid').w2grid({ 

// Keep your existed code

});

// Add this line code

gridData.localSort();

Hope this help

tryingToLearn
  • 10,691
  • 12
  • 80
  • 114
Trương Hoàng Phi Ưng
  • 21
  • 2
  • Welcome to StackOverflow. While your proposed code might solve the OP's problem, the above answer lacks explanation or context. Consider editing your answer to provide an explanation about why or how your solution resolves the question at hand. See the community guidelines on how to answer questions- https://stackoverflow.com/help/how-to-answer – Richie Thomas Aug 11 '18 at 05:21