easyui datagrid联动左右移动示例

    <div style="float:left;margin-right:20px">
        <table class="easyui-datagrid" title="easyui datagrid联动左右移动示例" style="width:330px;height:250px"
               data-options="url:'datagrid_data1.json',method:'get'" id="dgl">
            <thead>
                <tr>
                    <th data-options="field:'itemid'">Item ID</th>
                    <th data-options="field:'productid'">Product</th>
                    <th data-options="field:'listprice'">List Price</th>
                    <th data-options="field:'unitcost'">Unit Cost</th>
                    <th data-options="field:'操作',formatter:function(v,r){return getOp(r)}">操作</th>
                </tr>
            </thead>
        </table>
    </div>
    <div style="float:left;">
        <table class="easyui-datagrid" title="easyui datagrid联动左右移动示例" style="width:330px;height:250px" id="dgr">
            <thead>
                <tr>
                    <th data-options="field:'itemid'">Item ID</th>
                    <th data-options="field:'productid'">Product</th>
                    <th data-options="field:'listprice'">List Price</th>
                    <th data-options="field:'unitcost'">Unit Cost</th>
                    <th data-options="field:'操作',formatter:function(v,r){return getOp(r,true)}">操作</th>
                </tr>
            </thead>
        </table>
    </div>
    <script type="text/javascript">
        function getOp(r, isRight) { return '<a href="#" onclick="return moveToRight(\'' + r['itemid'] + '\'' + (isRight ? ',true' : '') + ')">' + (isRight ? '&lt;--' : '--&gt;') + '</a>' }
        function moveToRight(id, isRight) {
            var sourcedg = isRight ? '#dgr' : '#dgl', targetdg = isRight ? '#dgl' : '#dgr';
           
            var rows = $(sourcedg).datagrid('getRows'), r;
            for (var i = 0; i < rows.length; i++) {//查找数据行
                if (rows[i]['itemid'] == id) { r = rows[i]; break; }
            }
            if (r) {
                $(targetdg).datagrid('appendRow', r);//添加数据库
                $(sourcedg).datagrid('deleteRow', $(sourcedg).datagrid('getRowIndex', r));//左边删除此行
            }
            return false;
        }
    </script>