Jqgrid 如何根据url参数的变化刷新表格内容？
页面的左侧有一个组织目录，当点击目录的不同条目时，Jqgrid要根据条目确定参数刷新表格。这个怎么做到？...
页面的左侧有一个组织目录，当点击目录的不同条目时，Jqgrid要根据条目确定参数刷新表格。这个怎么做到？
展开
展开全部
你好提问者：
大体流程是这样的：
首先你说的那个组织目录呢，在他点击的时候会链到不同的页面显示不同的数据！
加载JQGrid url会找相应的action，查询数据，然后回显！ 这里有段jqGrid的代码，仅供参考！
jsp页面
<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib uri="/sys-tags" prefix="tl"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>文章分类</title>
</head>
<body>
<div class="search_tit">文章分类</div>
<form method="post" target="_blank">
<table class="search_table">
<tr>
<td>
<div>
分类名称：
</div>
<input class="search_text" type="text" name="catname" id="catname" />
</td>
<td>
<input id="submitButton" class="button" value="搜索" type="button" onclick="submitKey(1)"/>
<input id="submitButton" class="button" value="添加分类" type="button" onclick="articleCatAdd()"/>
</td>
</tr>
</table>
</form>
<table id="gridTable"></table>
<div id="gridPager"></div>
</body>
</html>
js 脚本：
$("#gridTable").jqGrid({
url:webRoot +'admin/articleQueryAll.action',
datatype: "json",
mtype:"POST",
shrinkToFit:false,
autoScroll: true,
width:700,
forceFit:false,
cache: false,
colNames:['文章编号','分类编号','文章题目','文章url', '文章作者', '作者的email', '关键字','状态','描述','排序','操作'],
colModel:[{name:'artid',index:'art_id',sortable:true,hidden:true,sorttype:"int"},
{name:'catid',index:'cat_id',hidden:true,sortable:true,sorttype:"int"},
{name:'arttitle',index:'art_title',width:"100px",sortable:true},
{name:'arturl',index:'art_url',sortable:true,width:"220px"},
{name:'artauthor',index:'art_author',sortable:true,width:"80px"},
{name:'artauthoremail',index:'art_author_email',sortable:true,hidden:true},
{name:'artkeywords',index:'art_keywords',sortable:true,hidden:true},
{name:'isdelete',index:'is_delete',sortable:true,width:"80px",align:"center",formatter:'select', editoptions:{value:"0:<img style='cursor:pointer' value='0' title='启用' src='"+webRoot +"WEB-FACE/css/images/yes.gif' />;1:<img style='cursor:pointer' value='1' title='禁用' src='"+webRoot+"/WEB-FACE/css/images/no.gif' />"}},
{name:'artdesc',index:'art_desc',sortable:true,hidden:true},
{name:'sortorder',index:'sort_order',width:"80px",sortable:true,align:"center"},
{name:'act',index:'act',sortable:false,width:"110px"},
],
sortname:'art_id',
sortorder:'desc',
rowNum:10,
rowList:[10,25,50],
viewrecords:true,
jsonReader: {
root:"dataRows", // 数据行（默认为：rows）
page: "currPage", // 当前页
total: "totalPages", // 总页数
records: "totalRecords", // 总记录数
repeatitems : false // 设置成false，在后台设置值的时候，可以乱序。且并非每个值都得设
},
prmNames:{rows:"articleSelectKey.pageSize",page:"articleSelectKey.currPage",sort:"articleSelectKey.orderBy",order:"articleSelectKey.order"},
pager:"#gridPager",
// caption: "品牌信息列表",
onSortCol: function(index, sortorder){
var curPage = $(".ui-pg-input").val();
submitKeyArticle(curPage);
},
onPaging: function(pgButton){
// caption: "品牌信息列表",获取控件里的值
var arttitle = $("input[name='arttitle']").val();
var totalPages = $("#gridTable").jqGrid('getGridParam', 'lastpage');
if(/^[0-9]*[1-9][0-9]*$/.test($.trim($(".ui-pg-input").val()))){
if(totalPages - $.trim($(".ui-pg-input").val()) < 0){
$(".ui-pg-input").val(totalPages);
}
}
$("#gridTable").jqGrid('setGridParam',{
datatype:'json',
postData:{'articleSelectKey.arttitle':arttitle},
});
},
//获取前台页面的状态 是否在线
onCellSelect:function(rowId,cellCount){
var data = $("#"+rowId +">td");
var artid = data[0].innerHTML;
if(cellCount == 7){
openStore(artid,rowId);
}
},
// caption: "品牌信息列表",获取列表里的操作值
gridComplete: function(){
if(permissionId!="" && permissionId==1){
var ids = jQuery("#gridTable").jqGrid('getDataIDs');
for(var i=0;i < ids.length;i++){
var cl =jQuery("#gridTable").jqGrid('getRowData', ids[i]);
var actions = "<div><nobr><a href='#' class='listwordbtn' onclick='editArticle(" + cl.artid+");'>编辑</a><a href='#' class='listwordbtn' onclick='articleDelete(" + cl.artid+");'>删除</a></nobr></div>";
jQuery("#gridTable").jqGrid('setRowData',ids[i],{act:actions});
}
}
}
}).navGrid('#gridPager',{edit:false,add:false,del:false,search:false});
// 确定键_根据条件查询
function submitKeyArticle(curPage){
var arttitle = $("input[name='arttitle']").val();
$("#gridTable").jqGrid('setGridParam',{
datatype:'json',
postData:{'articleSelectKey.arttitle':arttitle},
page:curPage
}).trigger("reloadGrid");
}
//添加
function articleAdd(){
$(".index_page").load(webRoot + "admin/articleManageShow.action?_="+Math.random()+"&pageset.pageType=1");
}
//编辑_修改
function editArticle(artid){
$(".index_page").load(webRoot + "admin/articleManageShow.action?_="+Math.random()+"&pageset.pageType=2&ids=" + artid);
}
//返回展示类表
function toGrid() {
$(".index_page").load(webRoot + "admin/articleManageShow.action?_="+Math.random()+"&pageset.pageType=0");
}
//上线
function openStore(artid,rowId){
if(permissionId==""||permissionId==0){
return;
}
$.post(webRoot +"admin/isDeleteArticle.action", { artid : artid},
function(data) {
var res = eval(data);
$("#"+rowId+" td").each(function(i){
if(i==7){
if(res.commitType == 0){
$(this).html("<img style='cursor:pointer' value='0' title='启用' src='" + webRoot + "WEB-FACE/css/images/yes.gif' />");
} else{
$(this).html("<img style='cursor:pointer' value='1' title='禁用' src='" + webRoot + "WEB-FACE/css/images/no.gif' />");
}
}
});
});
}
//删除
function articleDelete(artid){
if(confirm("确定删除？")){
$.post(webRoot +"admin/getArtidDelete.action?pageset.pageType=3", {ids:artid},
function(data){
var result = eval(data);
showDialog(result.message,webRoot + "admin/articleManageShow.action?pageset.pageType=0");
});
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
