jqGrid插件学习笔记

jqGrid禁用title属性的实现

2018-06-21  本文已影响0人  小人物的秘密花园

概述

最近项目中使用到jqGrid表格插件来呈现数据,想要自定义提示效果,并且禁用默认的title

实现

实现方法

  1. 使用jqGrid的事件gridComplete(当表格所有数据都加载完成而且其他的处理也都完成时触发此事件);
  2. 查找行$('#jqGrid').find('tbody tr.jqgrow');
  3. 查找me一行下的‘td’;
  4. 将每一个td元素的title属性置为空;

代码

<table id="jqGrid"></table>
<!-- 分页 -->
<div id="jqGridPager"></div>
// 表格初始化
function  _initTable() { 
    $("#jqGrid").jqGrid({
          url: '',// 服务器请求地址
          mtype: "",// 请求方法 get || post
          datatype: "json",// 数据格式
          colModel: [// 列对象配置
                  {
                        label: '操作',
                        name: '',
                        formatter: function(cellValue, options, cellObject) {
                            return "<span onclick='addRow'><i class='fa fa-plus' aria-hidden='true'></i></span><span onclick='deleteRow'><i class='fa fa-minus' aria-hidden='true'></i></span>";
                        }
                    },
                    {
                        label: '规格1',
                        name: '',
                        editable: true

                    },
                    {
                        label: '规格2',
                        name: '',
                        editable: true
                    },
                    {
                        label: '规格3',
                        name: '',
                        editable: true

                    },
                    {
                        label: '库存量',
                        name: '',
                        editable: true
                    },
                    {
                        label: '价格',
                        name: '',
                        editable: true
                    },
                    {
                        label: '上下架',
                        name: '',
                        editable: true
                    },

                    {
                        label: '操作',
                        name: '',
                        formatter: function(cellValue, options, cellObject) {
                            return "<span onclick='dropOff'>下架</span>";

                        }
                    }
          ],
         gridComplete: function() {
           var aTr = $('#jqGrid').find('tbody tr.jqgrow');
            for (var i = 0; i < aTr.length; i++) {
                var item = $(aTr[i]).children();
                 for (var j = 0; j < item.length; j++) {
                    $(item[j]).attr('title', '')
                }
             }
          },
          viewrecords: true,// 显示总条数
          height: 600,
          rownumbers: true,// 显示行号
          rowNum: 10,// 每页数据条数
          rowList: [10, 30, 50, 80, 100],// 数据条数集合
          jsonReader: { //    后台分页参数的名字
              root: "row", // 表格数据
              page: "page", // 页码
              total: "total", // 总页数
              records: "count", // 总条数
              repeatitems: false,
          },
          pager: "#jqGridPager",// 分页
          autowidth: true,
          hoverrows: true,
      });
  }
上一篇下一篇

猜你喜欢

热点阅读