dwz中对jqGrid设置a标签

r囧r小猫 2021-09-10 10:38 392阅读 0赞

**前言**：本篇来介绍在DWZ框架中，如何对jqGrid组件进行a标签设置，防止其在点击的时候跳出dwz框架。

![Center][]

##  ##

## 第一步 ##

## 在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][dwz_jqGrid]

[Center]: /images/20210511/4e56410fca85498f981a33f28a771996.png
[dwz_jqGrid]: http://blog.csdn.net/qing_gee/article/details/41113621