Why client side pagination dont work with filter and sorting on datagrid??

[dayaners]

I cant put to work,when I use the three features together, or pagination not working or filter. Can anyone help me?

Thats my cod for pagination:

Code:

function pagerFilter(data){
  if (typeof data.length == 'number' && typeof data.splice == 'function'){  // is array
    data = {
      total: data.length,
      rows: data
    }
  }
  var dg = $(this);
  var opts = dg.datagrid('options');
  var pager = dg.datagrid('getPager');
  pager.pagination({
    onSelectPage:function(pageNum, pageSize){
      opts.pageNumber = pageNum;
      opts.pageSize = pageSize;
      pager.pagination('refresh',{
        pageNumber:pageNum,
        pageSize:pageSize
      });
      dg.datagrid('loadData',data);
    }
  });
  if (!data.originalRows){
    data.originalRows = (data.rows);
  }
  if (!opts.remoteSort && opts.sortName){
    var target = this;
    var names = opts.sortName.split(',');
    var orders = opts.sortOrder.split(',');
    data.originalRows.sort(function(r1,r2){
      var r = 0;
      for(var i=0; i<names.length; i++){
        var sn = names[i];
        var so = orders[i];
        var col = $(target).datagrid('getColumnOption', sn);
        var sortFunc = col.sorter || function(a,b){
          return a==b ? 0 : (a>b?1:-1);
        };
        r = sortFunc(r1[sn], r2[sn]) * (so=='asc'?1:-1);
        if (r != 0){
          return r;
        }
      }
      return r;
    });
  }
  var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
  var end = start + parseInt(opts.pageSize);
  data.rows = (data.originalRows.slice(start, end));
  return data;
}

and this is my datagrid:

Code:

 $('#dg').datagrid({
      title:'dg',
      data: result,
      striped: true,
      fitColumns:true,
      singleSelect:true,
      pagination:true,
      idField:'id',
      loadFilter:pagerFilter,
      remoteSort:false,
      multiSort:true,
      pageSize:20,
      toolbar:[{
          iconCls: 'icon-excel',
          text:'Export',
          handler: function(){alert('excel')}
        },'-',{
          iconCls: 'icon-help',
          handler: function(){alert('help')}
        }],
        columns:[[
         {field:'id',title:'id',width:13 ,align:'center',sortable:true},
         {field:'name',title:'name',width:50 ,align:'center',sortable:true}
        ]]
       }); //fim datagrid
  }

and i already set the filter:

Code:

 
$(function(){
            var dg = $('#dg').datagrid();
            dg.datagrid('enableFilter')
}

[stworthy]

The client side pagination is supported in 'enableFilter' function, you do not need to override the 'loadFilter' function again.

Code:

var dg = $('#dg').datagrid({
	remoteFilter: false,
	pagination: true,
	pageSize: 5,
	pageList: [5,10,20,50]
});
dg.datagrid('enableFilter');
dg.datagrid('loadData', data);

[dayaners]

Worked, thanks