欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jgGrid实现左移、右移、上移、下移等操作的代码教程

程序员文章站 2023-12-29 09:18:04
摘要: 最近在项目需求中通过jqgrid实现表格中的数据:左移、右移、上移、下移和置顶 等操作。 下面记录实现的方法。 下面是代码片段: 右移(其实就是向一个grid容器中插入一行数据):...

摘要:

最近在项目需求中通过jqgrid实现表格中的数据:左移、右移、上移、下移和置顶 等操作。
下面记录实现的方法。

下面是代码片段:

右移(其实就是向一个grid容器中插入一行数据):

//这个方法是获取ztree节点内容,插入到grid表中
function bindbtnrightmethod() {
    //获取ztree对象
    var ztreeobj = $.fn.ztree.getztreeobj("ztreeid");
    //获取光标选中的tree节点
    var selectednodes = ztreeobj.getselectednodes();
    if (selectednodes.length == 0) {
        $.modalalert("操作失败!未选中节点。");
        return;
    } else {
        //新增一行
        var data = { ksid:"10", flksid:"101", ksmc: "消化科" };
        addrowdatabygridelementid("jqgridid", data);
    }
}

//摘要:
//内容:向grid表中添加一行记录
function addrowdatabygridelementid(id, data) {
 //获取当前grid中的表id集合
 var jqgrid = $('#' + id);
 var ids = jqgrid.getdataids();
 //定义标量,记录ids中的rowid的最大值
 var maxid = 0;
 if (ids.length > 0) {
     for (var i = 0; i < ids.length; i++) {
         var tmpid = jqgrid.getind(ids[i]);
         if (maxid < tmpid) {
             maxid = tmpid;
         }
     }
 }
 //这里是在给新增的rowid自定义一个有序值
 var rowid= maxid + 1;
 //执行新增操作
 jqgrid.addrowdata(rowid, data, rowid);
}

左移(其实是从grid表中删除一行):

//摘要:
//内容:按钮左移
function bindbtnleftmethod() {
  //删除选中行
  var rowid = $("#jqgridid").jqgrid('getgridparam', 'selrow');
  if (rowid == "" || rowid == undefined || rowid == null) {
      $.modalalert("移除行未选中!");
      return;
  } else {
      var flag = $("#jqgridid").jqgrid("delrowdata", rowid);
      if (!flag) {
          $.modalalert("移除操作失败!");
      }
  }
}

上移:

//摘要:
//内容:按钮上移
function bindbtnupmethod() {
    var obj = $("#jigougridlist");
    var ids = obj.getdataids();
    var rowid = obj.jqgrid('getgridparam', 'selrow');
    if (rowid == "" || rowid == null || rowid == undefined) {
        $.modalalert("未选中行!");
        return false;
    }
    var rowindex = getrowindexbyrowid(ids, rowid);
    if (rowindex == 0) {
        $.modalalert('已经置顶,不能上移!');
    } else {
        var srcrowid = getrowidbyrowindex(ids, rowindex - 2);
        var rowupid = getrowidbyrowindex(ids, rowindex - 1);
        var rowdata = obj.jqgrid('getrowdata', rowid);
        var rowupdata = obj.jqgrid('getrowdata', rowupid);
        //删除当前行
        obj.delrowdata(rowid);
        obj.delrowdata(rowupid);
        //新插入一行
        obj.addrowdata(rowid, rowdata, "after", srcrowid);
        obj.addrowdata(rowupid, rowupdata, "after", rowid);
        //默认再选中新增的这个行
        obj.setselection(rowid);
    }
}

//摘要:
//内容:根据rowid,获取索引值
function getrowindexbyrowid(ids, id) {
    var index = 0;
    for (var i = 0; i < ids.length; i++) {
        if (ids[i] == id) {
            index = i;
        }
    }
    return index;
}

//摘要:
//内容:根据索引值获取rowid值
function getrowidbyrowindex(ids, index) {
    var rowid = "";
    for (var i = 0; i < ids.length; i++) {
        if (i == index) {
            rowid = ids[i];
        }
    }
    return rowid;
}

下移:

//摘要:
//内容:按钮下移
function bindbtndownmethod() {
    var obj = $("#jqgridid");
    var ids = obj.getdataids();
    var rowid = obj.jqgrid('getgridparam', 'selrow');
    if (rowid == "" || rowid == null || rowid == undefined) {
        $.modalalert("未选中行!");
        return false;
    }
    var rowindex = getrowindexbyrowid(ids, rowid);
    if (rowindex == (ids.length - 1)) {
        $.modalalert('已经置底,不能下移!');
    } else {
        var srcrowid = getrowidbyrowindex(ids, rowindex - 1);
        var rowdownid = getrowidbyrowindex(ids, rowindex + 1);
        var rowdata = obj.jqgrid('getrowdata', rowid);
        var rowdowndata = obj.jqgrid('getrowdata', rowdownid);
        //删除当前行
        obj.delrowdata(rowid);
        obj.delrowdata(rowdownid);
        //新插入一行
        obj.addrowdata(rowdownid, rowdowndata, "after", srcrowid);
        obj.addrowdata(rowid, rowdata, "after", rowdownid);
        //默认再选中新增的这个行
        obj.setselection(rowid);
    }
}

上一篇:

下一篇: