1

サーバー側のデータがあり、数万行のjqGridがあります。私はjqGridsネイティブを使用しmultiselect = true、次にさまざまなjqgridイベントで選択した行のIDをプッシュ/スプライスします...これはすべて完全に機能します。これをさらに一歩進めて、ユーザーが選択できる[選択した行の表示]オプションを使用して、選択した行の配列にIDを含む行のみを表示するフィルターをプログラムで作成します。

したがって、ユーザーが[選択した行を表示]オプションを選択したときに10,000行の125行を選択した場合、選択した行の配列にIDを持つ125行のみを表示するフィルターを作成します。

行を非表示にすることで、フィルタリングせずに選択を表示するいくつかの方法を試しましたが、57ページでユーザーが行を選択するという問題が発生しました...次に、[選択を表示]を選択すると、選択を表示する唯一の方法はページに移動することでした57。

dataformat=jsonと...を切り替えようdataformat=localとしましたが、これにより、jqGridコードのsTypeフィルタリングで頭痛の種が発生しました。

誰かがこの魔法のフィルターを作成する方法を持っているなら...または選択されたサーバー側のデータをフィルタリング/ソートするより良いアプローチはすべての助けに感謝します。

グリッドの作成をCRUDして、きれいに印刷しないという醜いフォーマットについてお詫びします=)

var selectedIDs = [], viewSelectedOnly = false;
    var WrapperDivID = $('#grid_wrapper'),
        GridDivID = $('#BatchBatchGrid');
    //used to help us get gridid out for shiftclick of header
    WrapperDivID.attr('data-id', '120');

    var _AppType = Enum.GridArray(Enums.Security_ApplicationType);

    $(document).ready(function () {
        GridDivID.jqGrid({


        colNames:[
            'LocationID' 
                ,
            'ChannelID' 
                ,
            'Post' 
                ,
            'Actions' 
                ,
            'ID' 
                ,
            'Posted' 
                ,
            'Channel' 
                ,
            'StoreCode' 
                ,
            'Location' 
                ,
            'Reference#' 
                ,
            'Remote Ref#' 
                ,
            'Open Date' 
                ,
            'Close Date' 
                ,
            'Sales + Tax' 
                ,
            'Status' 
                ,
            'Register #' 
        ],
        colModel:
        [
                {
name:
                            'Account_Location.ID'
                        ,
index:
                            'Account_Location.ID'
                        ,
width:
10                        ,
align:
                            'left'
                        ,
hidden:
true                }
                        ,
                {
name:
                            'Channel_Channel.ID'
                        ,
index:
                            'Channel_Channel.ID'
                        ,
width:
10                        ,
align:
                            'left'
                        ,
hidden:
true                }
                        ,
                {
name:
                            'Post'
                        ,
index:
                            'Post'
                        ,
width:
5                        ,
align:
                            'center'
                        ,
search:
false                        ,
sortable:
false                        ,
hidden:
true                }
                        ,
                {
name:
                            'Action'
                        ,
index:
                            'Action'
                        ,
width:
10                        ,
align:
                            'center'
                        ,
search:
false                        ,
sortable:
false                }
                        ,
                {
name:
                            'ID'
                        ,
index:
                            'ID'
                        ,
width:
10                        ,
align:
                            'left'
                        ,
hidden:
true                }
                        ,
                {
name:
                            'Posted'
                        ,
index:
                            'Batch_Batch.Posted'
                        ,
width:
10                        ,
align:
                            'left'
                        ,
search:
true                        ,
stype:
                            'select'
                        ,
searchoptions:
                            '{value: ddPosted }'
                }
                        ,
                {
name:
                            'Channel_Channel.Name'
                        ,
index:
                            'Channel_Channel.Name'
                        ,
width:
15                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'Account_Location.StoreCode'
                        ,
index:
                            'Account_Location.StoreCode'
                        ,
width:
7                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'Account_Location.Name'
                        ,
index:
                            'Account_Location.Name'
                        ,
width:
40                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'BatchNumber'
                        ,
index:
                            'Batch_Batch.BatchNumber'
                        ,
width:
15                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'RemoteReferenceNumber'
                        ,
index:
                            'RemoteReferenceNumber'
                        ,
width:
15                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'OpeningTime'
                        ,
index:
                            'OpeningTime'
                        ,
width:
15                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'ClosingTime'
                        ,
index:
                            'ClosingTime'
                        ,
width:
15                        ,
align:
                            'left'
                        ,
search:
                            'true'
                }
                        ,
                {
name:
                            'SalesPlusTax'
                        ,
index:
                            'SalesPlusTax'
                        ,
width:
15                        ,
align:
                            'left'
                }
                        ,
                {
name:
                            'Status'
                        ,
index:
                            'Batch_Batch.Open'
                        ,
width:
15                        ,
align:
                            'left'
                        ,
search:
true                        ,
stype:
                            'select'
                        ,
searchoptions:
                            '{value:ddStatuses}'
                }
                        ,
                {
name:
                            'RegisterNumber'
                        ,
index:
                            'RegisterNumber'
                        ,
width:
15                        ,
align:
                            'left'
                }

        ],

pager :$('#pager')                    ,
rowNum :"50"
                    ,
rowList :[10,20,50,100]                    ,
sortname :'Batch_Batch.Closingtime'
                    ,
sortorder :"desc"
                    ,
viewrecords :true                    ,
url :'../Grid/BatchBatchGetData'
                    ,
datatype :'json'
                    ,
mtype :'GET'
                    ,
autowidth :true                    ,
autoheight :true                    ,
height :400                    ,
multiselect :true                    ,
rownumbers :true        ,

        gridComplete: function(){
            var ids = GridDivID.jqGrid('getDataIDs');
            for(var i = 0; i < ids.length; i ++){
                var id = ids[i];
                var link = '<a href="../Accounting/BatchView?BatchID=' + id + '" target="_new">View</a>';
                GridDivID.jqGrid('setRowData',id,{Action:link});
                if (viewSelectedOnly) {
                     if(selectedIDs.indexOf(id) === -1){
                        $('#' + id).css('display','none');
                     }

                 }
            }
            var curr_width = WrapperDivID.width();
            GridDivID.jqGrid('setGridWidth', curr_width);

        },
        onSelectRow: function(id, status){
            var p = this.p, item = $(this).getRowData(id), _index = selectedIDs.indexOf(id);
            if(status){
                if(selectedIDs.indexOf(id) === -1)
                    selectedIDs.push(id);
            }else{
                selectedIDs.splice(_index, 1);
            }
        },
        loadComplete: function(gridData){
            var p = this.p, data = p.data, item, grid = $(this), index = p._index, rowid, i, selCount;
            //Logic for view selected
            if (gridData.rows.length > 0) {
              for (var i = 0; i < gridData.rows.length; i++) {
                 if(selectedIDs.indexOf(gridData.rows[i].id) !== -1){
                    grid.jqGrid('setSelection', gridData.rows[i].id, true);
                 }
              }
           }
        },
        onSelectAll: function(aRowids,status){
            var p = this.p;
            for (var i = 0; i < aRowids.length; i++) {
                var  _index = selectedIDs.indexOf(aRowids[i])
                if(status){
                    if(selectedIDs.indexOf(aRowids[i]) === -1)
                        selectedIDs.push(aRowids[i]);
                }else{
                    selectedIDs.splice(aRowids[i], 1);
                }
            }

        }


        }); //Ends jqGrid instantiation


        GridDivID.jqGrid('navGrid','#pager',{del:false,add:false,edit:false,search:true},{closeAfterAdd: true,closeAfterEdit: true},{closeAfterAdd: true,closeAfterEdit: true});
        GridDivID.jqGrid('filterToolbar',{stringResult: true,searchOnEnter:true});
        //GridDivID.jqGrid('gridResize',{minWidth:350,minHeight:100});

    });  //Ends Document Ready
4

1 に答える 1

0

私たちにとってはうまくいく解決策を見つけましたが、他の人にとっては必ずしも簡単に実装できるとは限りません。このようなクエリ文字列を取得し、SQL に対して使用するフィルター言語に解析するサーバー側コードがあります。

クエリ文字列パラメータ

nd:1354661490131
rows:50
page:1
sidx:Batch_Batch.Closingtime
sord:desc
filters:{"groupOp":"OR","rules":[{"field":"Batch_Batch.ID","op":"in","data":"'fa8d00f6-3faf-47a5-a0b0-b21879f2e54f', '8a59b8a5-66de-4ad1-ac89-81e645303b8c'"}]}

victorz http://www.trirand.com/blog/?page_id=393/discussion/extendig-default-search-operators-list/によるこの投稿を見つけました。 これにより、すべての潜在的な jqGrid オペレーターが得られます。

jqGrid オペレーター

['equal','not equal', 'less', 'less or equal','greater','greater or equal', 'begins with','does not begin with','is in','is not in','ends with','does not end with','contains','does not contain']

and correspndent list of aliases declared by sopt option:
['eq','ne','lt','le','gt','ge','bw','bn','in','ni','ew','en','cn','nc']

私は当初、まさに私が必要としていた「in」演算子があることに気づきませんでした =)。フィルターパーサーで動作させるために、配列から文字列に変更する必要がありました["1", "2" "3"]..."'1', '2', '3'"

フィルターを作成する Javascript の外観

    var grid = $('#BatchBatchGrid');  
    f = { groupOp: "OR", rules: [] };
// String that is used to store array values for server side filtering
    var arrayToString= '';
    for (var i = 0; i < selectedIDs.length; i++) {
    arrayToString+= (i != selectedIDs.length - 1) ? "'" + selectedIDs[i] + "', " : "'" + selectedIDs[i] + "'";
    }
    f.rules.push({ field: "Batch_Batch.ID", op: "in", data: arrayToString});
    grid[0].p.search = true;
    $.extend(grid[0].p.postData, { filters: JSON.stringify(f) });
    grid.trigger("reloadGrid", [{ page: 1, current: true}]);

Last Stop Filter ビルダー - サーバー側

コントローラー側に到達すると、コードがスクラブされ、最終的に「where ID in ('1', '2', '3')」のような SQL 構文が書き出されます。

これが、サーバー側のデータでこれを達成しようとしている他の人に役立つことを願っています. 誰かがもっと簡単な解決策を持っているなら、私はそれらを見てもかまいませんが、これはうまくいきます...しかし、常に他の方法を見たい=)

于 2012-12-04T23:07:27.027 に答える