EasyUI Forum

General Category => Bug Report => Topic started by: bdolnik on October 14, 2015, 06:35:31 AM



Title: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: bdolnik on October 14, 2015, 06:35:31 AM
If I try to enable all 3 options... sorting, pagination and filtering, the sort that is done is only on the records displayed on the first page of the pagination. If I remove filtering sorting works correctly. If I remove pagination and leave filtering, sorting works correctly.

Is there any way to fix it so all 3 options can be used at once?

Thanks


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: jarry on October 14, 2015, 06:52:53 AM
How do you set these properties? Please provide an example to demonstrate your issue.


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: bdolnik on October 14, 2015, 07:16:00 AM
Thanks for the quick reply... here are the relevant pieces of the code. Hope you can help@

Code:
<table id="dg" class="easyui-datagrid" title="..." style="width:1050px;height:auto" sortName="partnumber" sortOrder="asc" rownumbers="true" pagination="true">

Code:
<thead>
<tr>
<th data-options="field:'inventoryid',width:80">Inventory ID</th>
<th data-options="field:'lotstatusid',width:40,align:'center',editor:'text'">Status</th>
<th data-options="field:'partnumber',width:150,align:'left',editor:'text',sortable:'true'">Part Number</th>

</tr>
</thead>

Code:
<!--- This function is called to make an ajax call to get user details --->
$('#dg').datagrid({
iconCls: 'icon-edit',
remoteSort: false,
singleSelect: true,
toolbar: '#tb',
url:'user.cfc?method=getUserDetails',
type: 'get',
dataType:'json',
onClickRow: onClickRow
});
        $(function(){
            var dg = $('#dg').datagrid();
            dg.datagrid('enableFilter', [{
                field:'status',
                type:'combobox',
                options:{
                    panelHeight:'auto',
                    data:[{value:'',text:'All'},{value:'A',text:'A'},{value:'N',text:'N'}],
                    onChange:function(value){
                        if (value == ''){
                            dg.datagrid('removeFilterRule', 'status');
                        } else {
                            dg.datagrid('addFilterRule', {
                                field: 'status',
                                op: 'equal',
                                value: value
                            });
                        }
                        dg.datagrid('doFilter');
                    }
                }
            }]);


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: jarry on October 14, 2015, 09:11:24 AM
You set the 'remoteSort' to false, this means that you want to achieve the client side pagination. So please let your 'user.cfc' returns all the data to the datagrid. Make sure to use the newest 'datagrid-filter.js' file, it can be downloaded from http://www.jeasyui.com/extension/datagrid_filter.php


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: bdolnik on October 14, 2015, 09:52:50 AM
The user.cfc is returning all the data to the datagrid 'I believe'. If I set pagination="false" the sort works fine.

How would would one accomplish this... "So please let your 'user.cfc' returns all the data to the datagrid"?

So are you saying that if you use pagination, remoteSort has to be set to true? Because for me if I set remoteSort to true the sorting stops working completely.


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: jarry on October 14, 2015, 03:22:54 PM
No, you can set the 'remoteSort' to true or false. Please refer to this example http://jsfiddle.net/f739mtd6/


Title: Re: Sorting does not work when Pagination + Filtering is enabled in Datagrid
Post by: bdolnik on October 15, 2015, 06:03:17 AM
Ok I rewrote everything to follow your convention and now it works. Thank you very much!

Code:
<script>
$(function(){
var dg = $('#dg').datagrid({
filterBtnIconCls:'icon-filter',
remoteFilter: false,
        remoteSort:false,
pagination:true,
pageSize: 5,
pageList: [5,10,20,50],
url:'query.cfc?method=getUserDetails',
type: 'get',
dataType:'json'
});
dg.datagrid('enableFilter');
});
</script>