2 ak46143279 ak46143279 于 2016.01.28 09:59 提问

easyui datagrid按钮控制左右移动的JS问题

图片说明
实现点击-->按钮左边table的数据跳到右边,新手没有思路,求指点, 谢谢

4个回答

showbo
showbo   Ds   Rxr 2016.01.28 10:17
已采纳

操作配置formmater生成链接的时候加上这行的id


    formatter:function(v,r,index){return '<a href="#" onclick="moveToRight('+r['id列名称']+')">--></a>'}

    function moveToRight(id) {
        var rows = $('#左边grid的id').datagrid('getRows'),r;
        for (var i = 0; i < rows.length; i++) {//查找数据行
            if (rows[i]['id列名称'] == id) { r = rows[i]; break; }
        }
        if (r) {
            $('#右边grid的id').datagrid('appendRow', r);//添加数据库
            $('#左边grid的id').datagrid('deleteRow', $('#左边grid的id').datagrid('getRowIndex', r));//左边删除此行
        }
    }
ak46143279
ak46143279 回复无聊码农: 是我自己搞错了,把两个列表写反了,我再调试一下
2 年多之前 回复
ak46143279
ak46143279 回复无聊码农: 万分感谢,但还是有一些不明白JS中:console.log(sourcedg)在控制台打印出了我制定的目标列表,然后就没有往下执行了
2 年多之前 回复
showbo
showbo DEMO:http://www.w3dev.cn/article/20160128/easyui-datagrid-exchange-record.aspx
2 年多之前 回复
ak46143279
ak46143279   2016.01.28 10:03

部分代码如下:

姓名 联系电话 所属公司 赠送数量(个) 操作
            <div data-options="region:'east',width:410,border:false">
                <table id="aim-present-customer" class="easyui-datagrid"
                    data-options="
                    title : '目标赠送客户',
                    height:340,
                    idField:'id',
                    fitColumns:false,
                    rownumbers:true
                ">
                    <thead>
                        <tr>
                            <th data-options="field:'id',hidden:true"></th>
                            <th data-options="field:'customerName',width:60">姓名</th>
                            <th data-options="field:'phoneNumber',width:80">联系电话</th>
                            <th data-options="field:'company',formatter:function(company){
                                if (company){
                                    return company.value;
                                }
                            },align:'center',width:80">所属公司</th>
                            <th data-options="field:'presentCount',width:80">赠送数量(个)</th>
                            <th data-options="field:'op',width:60,formatter:OperateDeleteFormatter">操作</th>
                        </tr>
                    </thead>
                    跳转按钮:
                    function OperateFormatter(value,index){
var str = '';
str +='<a id="zouni" class="easyui-linkbutton">--></a>';
//str += '<a id="zouni" style="cursor:pointer;">--></a>';
return str;

}

Royal_lr
Royal_lr   Ds   Rxr 2016.01.28 10:18

就是清除左边数据,,显示右边数据就行了

MiaomiaoRose
MiaomiaoRose   2016.01.28 11:01

可不可以这样做呢,左边单击一次就记录一次这个数据的id,查询的时候就除去这些数据,右边则相反。

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
easyui 两个datagrid 数据左移右移
easyui 代码 类别 : ${goodscatModel.text } 《 移入 移出 》 js var hasAttrDataGrid; var noAttrDataGrid; $(function() { hasAttrDataGrid = $('#hasAttrDataGrid').datag
easyUI点击按钮后上下移动功能
easyUI的datagrid的两种简单实现,鼠标点击按钮后选择对象上下移动。一种在show.html 一种在demo文件夹中的good.html
easyui两个方框,左移右移
var dgUnrelatedRoleTable=$("#tableName"); var rows=dgUnrelatedRoleTable.datagrid("getSelections"); console.log(rows); for(var i=0;i<rows.length;i++){ var index =
easyui datagrid实现单行的上移下移,以及保存移动的结果
开始接触easyui感觉他的封装真是极佳的,善假于物的思想使我们善于站在巨人的肩膀上,人家封装好这么好的插件直接让俺们使用,我们在需求不同可进行简单的调整。
EasyUI-datagrid-行上下移动
EasyUI提供了很多行操作方法(行更新:updateRow,行末追加:appendRow,行插入:insertRow,行删除:deleteRow),通过这些方法的组合可以实现多种上下移动的效果。下面是通过删除、插入操作实现上下移动,然后通过getChanges方法获取删除和插入的数据行,并保存到数据库。 一、通过getRows()方法验证是否移动到顶行或末行 var rows=$('#dg'
easyui datagrid实现实现上下左右和回车切换单元格
能够直接使用
jquery easyui 怎么动态控制toolbar的显示
1、如果你的toolbar是这种新式的: $('#dg').datagrid({ toolbar: '#tb' }); tb"> 隐藏toolbar:$('#tb').hide(); 显示toolbar:$('#tb').show(); 2、如果是这种形式的: $('#dg').datagrid({ toolbar: [{ iconCls: 'icon-edi
JQuery EasyUI datagrid 键盘上下控制选中行
扩展datagrid的一个方法keyCtr var isbind=false; $.extend($.fn.datagrid.methods, { keyCtr : function (jq) { return jq.each(function () { var grid = $(this);
easyui datagrid表格可以通过键盘上下箭头键来选择行
转载自:http://blog.csdn.net/zhpengfei0915/article/details/37562229 $.extend($.fn.datagrid.methods, { keyCtr : function (jq) { return jq.each(function () { var grid = $(this);
EasyUI实现上下移动
热点推荐设置                                                .datagrid-view2         {             left:0px;             }                  var lastIndexp;       var tempindexp = -1;