我正在使用jqgrid。我的页面有三个选项卡,每个选项卡包含不同的网格。所有网格都有不同的ID。选项卡的内容是通过懒惰的AJAX请求获取的。现在,在渲染了所有三个网格后,我尝试通过函数重新加载网格
jQuery("#myOffersTable").trigger('reloadGrid');
只有最后重新加载的网格才会对其他网格起作用。
例如,如果网格加载seq为:1-2-3,则此代码仅适用于网格3 但如果seq是3-2-1那么它只适用于1。
但是,如果我尝试使用导航栏上的重新加载按钮重新加载网格,它可以正常工作。
我正在使用Struts2 jQuery Plugin.It使用jqGrid 3.6.4 我使用ajax加载json数据。
以下是我网格的定义。
<div id='t1'>
<s:url id="offersurl" action="offers"/>
<sjg:grid
id="offerstable"
caption="Customer Examples"
autoencode="false"
dataType="json"
href="%{offersurl}"
pager="true"
navigator="true"
navigatorAdd="false"
navigatorDelete="false"
navigatorEdit="false"
navigatorSearch="false"
gridModel="offers"
rowList="10,15,20"
rowNum="15"
rownumbers="true"
onCompleteTopics="addAcceptButtons"
filter="true"
>
<sjg:gridColumn name="id" index="id" title="ID" formatter="integer" sortable="false" search="false"/>
<sjg:gridColumn name="offeror" index="offeror" title="Offeror" sortable="true" search="false"/>
<sjg:gridColumn name="itemOffered" index="itemOffered" title="ItemOffered" sortable="false" search="true" searchoptions="{sopt:['eq']}"/>
<sjg:gridColumn name="quantityOffered" index="quantityOffered" title="QuantityOffered" sortable="false" search="true" searchoptions="{sopt:['eq','lt','gt']}"/>
<sjg:gridColumn name="expectedItem" index="expectedItem" title="ExpectedItem" sortable="false" search="true" searchoptions="{sopt:['eq']}"/>
<sjg:gridColumn name="expectedQuantity" index="expectedQuantity" title="ExpectedQuantity" sortable="false" search="true" searchoptions="{sopt:['eq','lt','gt']}"/>
<sjg:gridColumn name="acceptOffer" index="acceptOffer" title="Accept Offer" search="false"/>
</sjg:grid>
</div>
我有三个这样的网格都有不同的ID和所有东西。
每个网格上方都有一个搜索按钮,它使用参数sel.sel调用以下函数:1,2或3对应于每个网格
function search(sel)
{
alert("search");
if(sel==1)
{
tradeOffer = $("#games").val();
var srchValue = $("#srchoptions").val();
$.ajaxSetup({
data: {'gameId': tradeOffer},
});
jQuery("#offerstable").jqGrid('setGridParam',{url:"offers.action?q=1&srch="+srchValue,page:1});
//jQuery("#offerstable").trigger('reloadGrid');
$("#offerstable").trigger("reloadGrid");
}
else if(sel==2)
{
myTradeOfferGame = $("#my").val();
$.ajaxSetup({
data: {'gameId': myTradeOffer},
});
jQuery("#myOffersTable").jqGrid('setGridParam',{url:"offers.action?q=1",page:1});
jQuery("#myOffersTable").trigger('reloadGrid');
}
else if(sel==3)
{
acceptedTradeOfferGame = $("#accepted").val();
$.ajaxSetup({
data: {'gameId': acceptedTradeOffer},
});
jQuery("#acceptedtable").jqGrid('setGridParam',{url:"offers.action?q=1",page:1});
jQuery("#acceptedtable").trigger('reloadGrid');
}
}
为每个网格调用该函数,但
jQuery("#acceptedtable").trigger('reloadGrid');
仅适用于最后加载的网格。
答案 0 :(得分:3)
首先,在代码中定义变量myTradeOfferGame
和acceptedTradeOfferGame
(在else if(sel==2)
和else if(sel==3)
内),但使用myTradeOffer
和{{1 }}。看起来像是错误。
第二:acceptedTradeOffer
和else if(sel==2)
内的网址与第一个表中的网址相同:网址是静态的,为什么每次都要设置此值?您可能希望在else if(sel==3)
的所有网址中添加该部分?你应该自己解决这些问题。
在您的代码中,您可以看到,您使用$("#srchoptions").val()
更改$.ajaxSetup
的全局设置。如果更改3次,则仅保存最后一次。如果一次刷新中只有一个设置工作,$.ajax
仍然不是最佳方式。 jqGrid有参数$.ajaxSetup
,它为每个表设置ajaxGridOptions
的参数(参见Setting the content-type of requests performed by jQuery jqGrid)。
此外,jqGrid(每个实例)都有一个参数$.ajax
,它将作为postData
参数转发到$.ajax
。因此,您可以在jqGrid定义中使用此参数。如果您希望在每次 data
期间<{>}}的数据重新加载,您可以使用函数定义postData
。 trigger('reloadGrid')
的默认行为是测试postData
参数的字段是否为函数,它是如此,$.ajax
调用此函数获取值。所以你的代码可能如下所示:
data
顺便说一下,如果您使用HTTP GET进行数据请求,$.ajax
参数(// definition of 3 jqGrids
jQuery("#offerstable").jqGrid ({
postData: {'gameId': function() { return $("#games").val(); } },
//...
});
jQuery("#myOffersTable").jqGrid ({
postData: {'gameId': function() { return $("#my").val(); } },
//...
});
jQuery("#myOffersTable").jqGrid ({
postData: {'gameId': function() { return $("#accepted").val(); } },
//...
});
if(sel==1)
{
jQuery("#offerstable")
.jqGrid('setGridParam',
{url:"offers.action?q=1&srch="+encodeURIComponent($("#srchoptions").val()),
page:1})
.trigger('reloadGrid');
} else //...
// ...
)中的参数只会追加到网址(放置'? '和'&amp;'喜欢这样做。)
最终代码可以是以下内容:
data
和
postData