JS实现两个datagrid的数据移动

今天药忘吃喽~ 2022-06-03 03:53 101阅读 0赞

# 前言 #

页面上有两个表格，选中之后点击按钮可以实现数据由左到右或者由右到左的一个数据移动，点击确定之后才会与后台交互。

# JS代码 #

//从左往右移
    function onclick_leftToRight() {
       var slected = $('#leftGrid').datagrid("getSelections");
       for (var i = 0; i < slected.length; i++) {
        $('#rightGrid').datagrid('appendRow', slected[i]);//把选择的数据添加到右侧grid
        var rowIdex = $('#leftGrid').datagrid("getRowIndex",slected[i]);//得到索引
        $('#leftGrid').datagrid("deleteRow", rowIdex);//删除左侧grid中被移动的数据
       }
    }
    //从右往左移
    function onclick_rightToLeft() {
      var slected = $('#rightGrid').datagrid("getSelections");
      for (var i = 0; i < slected.length; i++) {
       $('#leftGrid').datagrid('appendRow', slected[i]);
       //得到索引
       var rowIdex = $('#rightGrid').datagrid("getRowIndex",slected[i]);
       $('#rightGrid').datagrid("deleteRow", rowIdex);
      }
    }

可以实现表格的移动，获得移动的数据代码如下

var $dg = $('#leftGrid');
     var rows = $dg.datagrid('getChanges');
     var insertRows = $dg.datagrid('getChanges', "inserted");
     var deletRows= $dg.datagrid('getChanges', "deleted");

剩下的就看自己的需求，需要什么参数就给后台传什么参数，接下来就是后台代码的实现了。

# 小结 #

js,easyui的用法自己都忘得差不多了![敲打][knock.gif]，在实现页面的过程中也在学习这些用法。

[knock.gif]: /images/20220603/f66373fa4404455d81a0770725169258.png

发表评论取消回复

表情：

评论列表（有 0 条评论，101人围观）

还没有评论，来说两句吧...

相关阅读

相关 js 实现两个input密码确认框

js 实现两个input密码确认框 <!DOCTYPE html> <html lang="en"> <head> <me

痛定思痛。/ 2023年07月22日 15:29/ 0 赞/ 110 阅读

相关 JS用两个栈实现一个队列

题目：请你仅使用两个栈实现先入先出队列。队列应当支持一般队列支持的所有操作（push、pop、peek、empty）：实现 MyQueue 类： void push

心已赠人/ 2022年11月14日 10:19/ 0 赞/ 188 阅读

相关 jquery easyui datagrid实现数据修改

1、单击选中待修改行 ![Center][] 2、使用单独对话框修改数据 3、使用updateRow方法修改数据（注意这里只是修改了网页上显示的数据，并没有同步修改

梦里梦外;/ 2022年08月03日 05:13/ 0 赞/ 331 阅读

相关 JS实现两个datagrid的数据移动

前言页面上有两个表格，选中之后点击按钮可以实现数据由左到右或者由右到左的一个数据移动，点击确定之后才会与后台交互。 JS代码 //从左往右移

今天药忘吃喽~/ 2022年06月03日 03:53/ 0 赞/ 102 阅读

相关 java实现两个select框内容左右移动，js实例

![70][] js编码： $(document).ready(function ()\{ //双击将选中的option追加至select2中 $("\select

偏执的太偏执、/ 2022年05月24日 05:55/ 0 赞/ 175 阅读

相关 JAVA如何实现两个数据合并

首先定位问题我需要把两个数组合并成一个数组技术选型使用第三方SDK SDK 全名 commons-lang3:3.7

柔光的暖阳◎/ 2022年05月22日 09:21/ 0 赞/ 307 阅读

相关用两个栈实现队列（JS实现）

题目描述用两个栈来实现一个队列，完成队列的Push和Pop操作。队列中的元素为int类型思路假设两个栈分别为 stack1 和 stack2，将stack

小咪咪/ 2022年05月15日 05:39/ 0 赞/ 251 阅读

相关两个select左右移动、上下移动

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xht

ゞ浴缸里的玫瑰/ 2022年04月14日 05:47/ 0 赞/ 245 阅读

相关 js实现div移动

之后想做一个可以展示数据存储位置变化的示意图，前期先做简单的两列互换。首先先把格子画出来，因为想做列的移动，所以一列是一个div。 HTML： <div cl

墨蓝/ 2022年03月15日 02:26/ 0 赞/ 424 阅读

相关 js--两个例子

前言之前介绍的是JavaScript的基础知识，看多了自然就会乏味，所以在这里放上两个小例子，解解乏。内容 1、由json对象创建一个table表格 j

末蓝、/ 2021年09月27日 04:22/ 0 赞/ 277 阅读