版权声明:欢迎转载,请注明沉默王二原创。 https://blog.csdn.net/qing_gee/article/details/41043847
前言:本篇来介绍在DWZ框架中,如何对jqGrid组件进行a标签设置,防止其在点击的时候跳出dwz框架。
第一步
在dwz.ajax.js文件中先增加如下方法,仿照ajaxTodo方法进行改造,本方法是进行ajax请求成功后的jqGrid表格的数据刷新
/**
* jqgrid中的ajaxtodo方法处理
*
* @param url
* @param jqgridid
*/
function ajaxTodojqgrid(url, jqgridid){
$.ajax({
type:'POST',
url:url,
dataType:"json",
cache: false,
success: function (json){
DWZ.ajaxDone(json);
if (json[DWZ.keys.statusCode] == DWZ.statusCode.ok){
// 对jqgrid进行重载
$("#" + jqgridid).trigger("reloadGrid");
}
},
error: DWZ.ajaxError
});
}
第二步
本文件内部的$.fn.extend({方法体内增加对a标签的扩展方法ajaxTodojqgrid,仿照ajaxTodo进行构造,本方法的作用是通过a标签的属性rel和href弹出操作确认框后,进行ajax请求
// jqgrid中操作
ajaxTodojqgrid:function(){
return this.each(function(){
// 点击的jquery对象
var $this = $(this);
$this.click(function(event){
// url地址
var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
DWZ.debug(url);
if (!url.isFinishedTm()) {
alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
return false;
}
// 获取标题
var title = $this.attr("title");
// 获取需要刷新的jqgridid
var jqgridid = $this.attr("rel");
if (title) {
alertMsg.confirm(title, {
okCall: function(){
// 调用方法
ajaxTodojqgrid(url, jqgridid);
}
});
} else {
ajaxTodojqgrid(url, jqgridid);
}
// 阻止当前a标签的动作
event.preventDefault();
});
});
},
第三步
在对应的列表页面对应的js中增加对jqgrid中的a标签进行dwz加载操作,你可以写到共通方法内部,在是在jqGrid的gridComplete方法中执行的,也就是说jqGrid的初始化完成后,需要进行如下两个方法的调用,你可以参照第三步
/**
* 设置jqgrid的超链接方式
*/
function initjqgridNavTab(){
// navTab table.jqgrid
$(".jqgrid a[target=navTab]").each(function(){
$(this).click(function(event){
var $this = $(this);
var title = $this.attr("title") || $this.text();
var tabid = $this.attr("rel") || "_blank";
var fresh = eval($this.attr("fresh") || "true");
var external = eval($this.attr("external") || "false");
var url = unescape($this.attr("href")).replaceTmById($(event.target).parents(".unitBox:first"));
DWZ.debug(url);
if (!url.isFinishedTm()) {
alertMsg.error($this.attr("warn") || DWZ.msg("alertSelectMsg"));
return false;
}
navTab.openTab(tabid, url,{title:title, fresh:fresh, external:external});
event.preventDefault();
});
});
}
function initjqgridAjaxtodo() {
// dwz.ajax.js jqgrid
if ($.fn.ajaxTodojqgrid) {
$("a[target=ajaxTodojqgrid]").ajaxTodojqgrid();
}
}
第四步
然后在jqgrid的 gridComplete : function() {方法中增加调用
// 初始化超链接方式
initjqgridNavTab();
// 初始化ajaxtodo
initjqgridAjaxtodo();
相关文章:dwz嵌入jqGrid