web-dev-qa-db-ja.com

jqueryのjqgridを理解しようとしています。 AJAX呼び出しのURLを変更するにはどうすればよいですか?

チュートリアルからすべてが機能し、データに置き換えられましたが、ハードコードされた状況です。たとえば、私が取り組んでいるチュートリアルでは、次のようになっています。

jQuery(document).ready(function(){ 
  jQuery("#list").jqGrid({
    url:'http://127.0.0.1/products/index.php/mystuff/test/1/5/productname/desc',
    datatype: 'xml',
    mtype: 'GET',
    colNames:['ProductID','title', 'description','price','tax','notes'],
    colModel :[ 
      {name:'invid', index:'invid', width:55}, 
      {name:'invdate', index:'invdate', width:90}, 
      {name:'amount', index:'amount', width:80, align:'right'}, 
      {name:'tax', index:'tax', width:80, align:'right'}, 
      {name:'total', index:'total', width:80, align:'right'}, 
      {name:'note', index:'note', width:150, sortable:false} ],
    pager: jQuery('#pager'),
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'title',
    sortorder: "desc",
    viewrecords: true,
    imgpath: 'http://127.0.0.1/products/public/themes/basic/images',
    caption: 'Product List'
  }); 
}); 

ただし、URLはデータをプルアップするようにハードコーディングされています。チュートリアルには次のものがあります。

jQuery(document).ready(function(){ 
  jQuery("#list").jqGrid({
    url:'example.php',
    datatype: 'xml',
    mtype: 'GET',
    colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],
    colModel :[ 
      {name:'invid', index:'invid', width:55}, 
      {name:'invdate', index:'invdate', width:90}, 
      {name:'amount', index:'amount', width:80, align:'right'}, 
      {name:'tax', index:'tax', width:80, align:'right'}, 
      {name:'total', index:'total', width:80, align:'right'}, 
      {name:'note', index:'note', width:150, sortable:false} ],
    pager: jQuery('#pager'),
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'id',
    sortorder: "desc",
    viewrecords: true,
    imgpath: 'themes/basic/images',
    caption: 'My first grid'
  }); 
}); 

明らかに、クエリ文字列のデータは変更され、常に同じURLが必要になるとは限りません: http://127.0.0.1/products/index.php/mystuff/test/1/5/productname/desc

また、example.phpを使用したチュートリアルでは、適切なデータを取得できるようにクエリ文字列変数が必要ですが、私が見つけた部分は表示されません。では、クエリ文字列を変更するにはどうすればよいですか?アイテムを動的に送信するにはどうすればよいですか?また、ハードコードURLがあるため、ポケットベルボタンは次のようなものを送信します。

http://127.0.0.1/products/index.php/mystuff/test/1/5/productname/desc?page=2&rows=10&sidx=productname&sord=desc&nd=1248988261293&_search=false

/ test /適切な変数のようなURLを取得するにはどうすればよいですか?クエリ文字列を変更するにはどうすればよいですか?

助けてくれてありがとう。私はそれがあまり明白ではないことを願っています。 setGridParam({url:newvalue}) が見つかりましたが、使用方法がわかりませんでした。

これが ドキュメント です。チュートリアルは最初の部分、上部にあります。

編集:以下をありがとう。 example.phpを使用したチュートリアルで、setGridParamがどのように使用されているかを確認しようとしています。彼らは単にexample.phpを持っており、htmlページからexample.phpページにクエリ文字列変数を取得した方法がわかりません。 setGridParamはこれを達成するための正しい方法かもしれませんが、例のどこにもないため、最初のクエリ文字列変数がどのように渡されたかを理解できません。

私はこれができることを知っています:

    function gridSearch()
    {
        $("#list").setGridParam(
            {

                  url:"http://127.0.0.1/products/index.php/mystuff/test/1/5/productname/desc",
                page:1
            }
            ).trigger("reloadGrid");//Reload grid trigger
        return false
    }

<input id="sData" class="EditButton" type="submit" value="Search" onClick="return gridSearch()"/>

グリッドをリロードします(テストしましたが、機能します)が、そもそもチュートリアルのアイテムをどのように送信したのでしょうか。ボタンをリロードしたくないが、最初にロードするために変数を渡すだけの場合はどうなりますか?

14
johnny

グリッドを作成したら、URLを作成してこれを指定し、グリッドをトリガーしてリロードできます。

jQuery("#list").jqGrid().setGridParam({url : 'newUrl'}).trigger("reloadGrid")
46
redsquare

あなたはこれを試すことができます:

jQuery("#list")
    .jqGrid()
    .setGridParam({
        data:'xml',
        url : 'newUrl'
    })
    .trigger("reloadGrid");
2
Jeff Gao

Js関数でjqgridjsコードを記述したとします。したがって、そのメソッドでは、変数でURLを動的に渡しますrlGetLst jqgridコードでは、いくつかの属性を指定する必要があります。

url: urlGetLst,//(will be dynamic)
//and
loadonce: false

このオプションを使用すると、毎回指定されたURLが呼び出され、jqgridが新しいデータで更新されます。

そして、jqgrid load関数を呼び出す前にrl以下のコードを呼び出し/実行します

$("#jqgridtab").GridUnload();
1
Ankit Adlakha