如何解决从jQuery.load问题调用的jqGrid表
| 所有。 当我从jQuery.load（）调用jqGrid表时。我发现它只能在第一次使用。以后调用将不起作用，并且浏览器调试不会显示任何错误。我只能看到，jqGrid输出表在底部丢失了它的搜索和传呼按钮。 我称它为使用此代码。 <script type=\"text/javascript\">
$(document).ready(function(){
$.ajaxSetup ({
cache: false
});
$(\'#form\').submit(function(){
$(\'#report-box\').load(\'?action=Q\',$(this).serialize(),function(){
$(\"#report\").jqGrid(\'navGrid\',\'#report-box\',{ edit:false,add:false,del:false });
});
return false;
});
});
</script>
</div>
</div>
<table id=\"report\"></table>
<div id=\"report-box\"></div>
<script type=\"text/javascript\">
jQuery(\"#report\").jqGrid({
url:\'?action=b&tpl=bydept&date={$date}\',datatype: \"json\",colNames:[\'xx\',\'xx\',\'xxx\',\'xxx\'],colModel:[
{ name:\'1\',index:\'dept\',width:55 },{ name:\'2\',index:\'key_1\',width:55 },{ name:\'3\',index:\'key_2\',{ name:\'4\',index:\'key_3\',{ name:\'5\',index:\'key_6\',{ name:\'6\',index:\'key_8\',{ name:\'7\',index:\'key_9\',{ name:\'8\',index:\'key_10\',{ name:\'9\',index:\'key_13\',{ name:\'10\',index:\'key_14\',width:55 }
],rowNum:10,rowList:[10,20,30],pager: \'#report-box\',sortname: \'dept\',viewrecords: true,sortorder: \"desc\",caption:\"xxxx\"
});
</script>
<form action=\'{$kbonez_root}report/action/q/\' method=\'post\' id=\'form\'>
<table width=\"100%\" border=\"0\">
<col class=\"col1\" />
<col class=\"col2\" />
<col class=\"col3\" />
<tr>
<th>Date</th>
<td><input name=\"date\" class=\"txt datepicker\" type=\"text\" value=\"2011-04-6\" /></td>
<td><span class=\"font_c2\">* not null</span></td>
</tr>
<tr>
<th>report type</th>
<td>
<select name=\"tpl\">
<option value=\'bydept\'>department report</option>
<option value=\'byidc\'>idc report</option>
<option value=\'bycenter\'>center report</option>
<option value=\'bybrand\'>rand report</option>
</select>
</td>
</tr>
</table>
<p class=\"btn\"><span><button type=\'submit\'>Submit</button></span></p>
</form>
first,we should output all the different type jqGrid-scriptcode in one page.
the choice in the form not too much,so
1.I should output it when the page init. use datatype:local
2.set different arguments for different tpl type.(not sure,I should read jqGrid manual.)
3.hide them.
second,when user select which type he want use and submit.
1.set Corresponding jqGrid table to visiable.
2. set current jqGrid datatype json.
3. use jqGrid to get it data.
$(\"#form button\").click(function(){
jQuery(\'#report\').jqGrid(\'GridUnload\',\'#report\');
jQuery(\'#report\').jqGrid({
colNames:[\'xxx\',\'x\',\'x\'],colModel:[
{ name:\'1\',width:55 }
],url:\'?action=b\',sortname: function() {
switch($(\"#form select option:selected\").val()){
case \'bydept\':
return \'dept\';
case \'byidc\':
return \'idc\';
}
},page:1,postData:{
date: function() { return $(\"#form input\").val(); },tpl: function() { return $(\"#form select option:selected\").val(); }
}
}).jqGrid(\'setCaption\',function() {
switch($(\"#form select option:selected\").val()){
case \'bydept\':
return \'xxx\';
case \'byidc\':
return \'xxx\';
}
});
解决方法
您能解释一下为什么需要用q5ѭ的jqGrid加载脚本吗？在我看来，有一种更好的方法来使用jqGrid。
您的代码中的一个问题是网格工作的总体组织。您应该每页创建一次jqGrid，并且也应该只调用一次ѭ6。原因很明确。 jqGrid将使用简单的“ 7” HTML代码片段创建一个包含标题，列，分页器等的表。这种转换应该执行一次。如果您不想显示网格包含的内容，可以将其放置在隐藏的div内部（具有style = \“ display：none \”）。如果您不想在初始化时加载网格包含，则应在开始时坐
datatype:\'local\'
$(\'#form\').submit
$(this).serialize()
setGridParam
url
postData
url
jQuery(\"#report\").trigger(\"reloadGrid\")
url
postData
type=\'button\'
type=\'submit\'
fieldset
click
jQuery(\"#report\").trigger(\"reloadGrid\")
$(\"#form button.btn\").click(function(){/*here call reloadGrid*/})postData
postData: {
date: function() { return $(\"#form input\").val(); },tpl: function() { return $(\"#form select option:selected\").val(); }
}
getScript
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
