easyUI开发实战案例

easyUI之datagrid一个框显示两个字段的值

2020-10-09  本文已影响0人  兰觅

一.显示数据

数据显示

效果如下:


效果图

二.编辑行显示输入框

{field: 'palletNoFromAndTo',title: '起止号',width: 245,align: 'center',titleAlign: true,formatter:function(value,row,index) {
                            var a= "<input id=\"palletNoFrom\" name=\"palletNoFrom\" class=\"easyui-textbox\"  style=\"width: 110px;;border: 1px solid #95B8E7;height: 30px\" />";
                            var b="<input id=\"palletNoTo\" name=\"palletNoTo\" class=\"easyui-textbox\"  style=\"width:110px;height: 30px;border: 1px solid #95B8E7\"/>";
                         return a+"~"+b;
                            },

效果如下:


效果图

三.绑定操作事件显示

    {field:'action',title:'Action',width:70,align:'center',
            formatter:function(value,row,index){
                if (row.editing){
                    var s = '<a href="#" onclick="saverow('+index+')">Save</a> ';
                    var c = '<a href="#" onclick="cancelrow('+index+')">Cancel</a>';
                    return s+c;
                } else {
                    var e = '<a href="#" onclick="editrow('+index+')">Edit</a> ';
                    var d = '<a href="#" onclick="deleterow('+index+')">Delete</a>';
                    return e+d;
                }
            }
        }

效果如下:


效果显示
上一篇下一篇

猜你喜欢

热点阅读