2

2つのjqGridを含むWebページを含むASP.NET-MVCサイトがあります。それぞれに独自の「URL」プロパティがリストされているため、両方とも別々のajax呼び出しを呼び出します。

これを（2つの別々の呼び出しではなく）両方のグリッドのjsonを一度に返す単一のjson呼び出しにマージできるかどうかを確認したい

だから、各メソッドの私のコントローラーでこれの代わりに

        return Json(new
        {
            Page = 1,
            Records =  GetData().Count,
            Rows = GetData(),
            Total = 1
        });

1回の呼び出しで両方を返すことができるかどうかを確認したかった：

   var grid1Data = (new
        {
            Page = 1,
            Records =  GetData().Count,
            Rows = GetData(),
            Total = 1
        });

   var grid2Data = (new
        {
            Page = 1,
            Records =  GetOtherData().Count,
            Rows = GetOtherData(),
            Total = 1
        });

      return Json(new
        {
                Grid1 = grid1Data, Grid2 = grid2Data
        });

しかし、今のところ私のコードは次のようになっているので、これがjavascript側でどのように機能するかを理解できません（個別のajax呼び出し）：

$("#myGrid1").jqGrid({
    mtype: "POST",
    url: "/GetGrid1Data",
    datatype: "json",

$("#myGrid2").jqGrid({
    mtype: "POST",
    url: "/GetGrid2Data",
    datatype: "json",

これは可能ですか？

4

2 に答える 2

1

一見すると、1回のAjax呼び出しごとに2つのグリッドを埋めることは魅力的に見えます。loadonce: true問題は、グリッドから少なくとも1つにオプションを使用する場合にのみ、いくつかの利点が得られることです。1つのAjax呼び出しを行い、別のグリッド（オプションがあります）を埋めることができる場合にのみloadonce: true。理由は簡単です。オプションのない両方のグリッドがある場合loadonce: true、ユーザーは列ヘッダーをクリックしてデータを並べ替えることができます。[次へ]ページをクリックして、1つのグリッドにフィルターを設定します。グリッドからのデータをサーバーからリロードするだけでよい場合。この場合、両方のグリッドのデータをロードする意味がありません。

loadonce: trueグリッドから少なくとも1つにオプションを使用する場合datatype: 'json', loadonce: trueは、グリッド内の2つのオプションを1つのオプションに変更できますdatatype: 'local'。最初のグリッドの塗りつぶし中にグリッドを塗りつぶすことができます。data2番目のグリッドのパラメータを設定して、を呼び出すことができますroloadGrid。

たとえば、最初のグリッドで使用できます

jsonReader: {
    root: "Grid1.Rows",
    page: "Grid1.Page",
    total: "Grid1.Total",
    records: "Grid1.Records"
}

したがって、グリッドはGrid1サーバー応答の一部からロードされます。さらに、またはコールバックのパラメータでGrid2プロパティを確認し、を使用して2番目のグリッドのオプションを設定してから、グリッドでイベントをトリガーできます。とオプションを使用して2番目のグリッドを作成する必要がある場合は、2番目のグリッドのオプションのリストから削除できます。dataloadCompletebeforeProcessingdatasetGridParam"reloadGrid"datatype: "local"mtypeurlloadonce

于 2012-07-04T21:40:43.283 に答える
-1

これでパフォーマンスが向上することを願っています。私の知る限り、jqgridは独自のajax呼び出しを使用してテーブルデータにデータを入力します。これはグリッドの問題を解決するためのよりクリーンな方法の1つですが、パフォーマンスがこの解決策を妨げている原因である場合は、次の戦略を試すことができます。

$("#test").jqGrid({

        datatype: 'clientSide',//most important
        colNames:['xx','yy'],
        colModel :[ 
                   {name:'sdsd', index:'termId',}, 
                   {name:'version', index:'version'}, 

                   ],
                   pager: '#testpager',
                   rowNum:10,
                   rowList:[10,20,30],

                   shrinkToFit:true,
                   autowidth:true
});//grid initialised.

 $("#test2").jqGrid({

            datatype: 'clientSide',//most important
            colNames:['xx','yy'],
            colModel :[ 
                       {name:'sdsd', index:'termId',}, 
                       {name:'version', index:'version'}, 

                       ],
                       pager: '#testpager',
                       rowNum:10,
                       rowList:[10,20,30],

                       shrinkToFit:true,
                       autowidth:true
    });//grid 2 initialised.

// JSP ------------

       <div id="tablecontainer" >
         <table id="test"><tr><td/></tr></table>
       <div id="testpager"></div>
</div>

  <div id="tablecontainer2" >
             <table id="test2"><tr><td/></tr></table>
           <div id="testpager2"></div>
    </div>

// --------

ボタンをクリックした後、ファイアアヤックスをクリックします。

コントローラ内でjson応答を次のように準備します

   { "test":{//list of json row data},
       "test2" :{//list of json row data}}

//これでajaxが成功するとデータを取得します

を使用してテーブルに追加します

  resposeSuccess(data){
            //loop through each row data and add it into respective table using
    $.each(data,function(tableId,tableJson){
       for(j=0;j<tableJson.length;tableJson++)
         $("#"+tableId).addRowData(""+j, tableJson[j]);
});


    }

つまり、jqgridの代わりに、それぞれのテーブルに個別にデータを追加する必要があります。

于 2012-07-04T12:56:25.907 に答える