easyui 追加文本框 数字框 及下拉框 （升级版）

Posted 2020-10-19 calmly

1.获取下拉框需要的数据

1 var sddata = {$sddata};
2         var sddataID = [];
3         var sddatafirst = ‘‘;
4         for(var i=0;i<sddata.length;i++){
5             if(!sddatafirst) sddatafirst =sddata[i].sdid;
6             sddataID[sddata[i].sdid] = sddata[i].sdname;
7         } 

2.datagrid 渲染数据

 1 CONFIG.WINCOLUMNSS =[[
 2              {title:‘订单原金额‘,colspan:2, align:"right"},
 3              {id:‘sum‘,colspan:2, align:"center"},
 4              {title:‘验货金额‘,colspan:2,align:"center"},
 5              {id:‘ysum‘,colspan:3,align:"right" }
 6          ],[
 7         {
 8             field : ‘code‘,
 9             title : ‘{:L("原材料编号")}‘,
10             width : ‘10%‘,
11         }, {
12             field : ‘mgname‘,
13             title : ‘{:L("原材料名称")}‘,
14             width : ‘15%‘,
15         },{
16             field : ‘sdid‘,
17             title : ‘{:L("仓库")}‘,
18             width : ‘20%‘,
19             formatter:function(value,row){
20                   return sddataID[value]
21                 },
22             editor:{
23                 type: ‘combobox‘,
24                 options:
25                 {
26                     valueField: "sdid",
27                     textField: "sdname",
28                     editable : false,
29                     data: sddata
30                 }
31             }
32         },{
33             field : ‘oprice‘,
34             title : ‘{:L("单价")}‘,
35             width : ‘10%‘,
36         }, {
37             field : ‘goodsno‘,
38             title : ‘{:L("订购数量")}‘,
39             width : ‘10%‘,
40         }, {
41             field : ‘tprice‘,
42             title : ‘{:L("金额")}‘,
43             width : ‘10%‘,
44         },{
45             field : ‘qgoodsno‘,
46             title : ‘{:L("实到数量")}‘,
47             width : ‘20%‘,
48             editor:‘numberbox‘
49         }, {
50             field : ‘remarks‘,
51             title : ‘{:L("备注")}‘,
52             width : ‘20%‘,
53             editor:‘textbox‘
54         }]];

3.加载编辑事件（加载单个的可编辑框）

 1 objs.wingrids=$(‘#wingrids‘).datagrid({
 2                 nowrap:true,
 3                 fit : true,
 4                 border : false,
 5                 striped : true, 
 6                 toolbar : ‘#wingridToolbars‘,
 7                 loadMsg : ‘{:L("正在加载数据，请稍后...")}‘,
 8                 rownumbers : true, 
 9                 columns:CONFIG.WINCOLUMNSS,
10                 onSelect:loadvprice,
11                     onClickCell: function(index,field,value){
12                    if (endEditing()){
13                      $(‘#wingrids‘).datagrid(‘selectRow‘, index).datagrid(‘editCell‘, {index:index,field:field});
14                      editIndex = index;
15                     }
16                   }
17             });

4.编辑js事件

 1  //可编辑
 2           $.extend($.fn.datagrid.methods, {
 3                    editCell: function(jq,param){
 4                             return jq.each(function(){
 5                              var opts = $(this).datagrid(‘options‘);
 6                         var fields = $(this).datagrid(‘getColumnFields‘,true).concat($(this).datagrid(‘getColumnFields‘));
 7                          for(var i=0; i<fields.length; i++){
 8                           var col = $(this).datagrid(‘getColumnOption‘, fields[i]);
 9                           col.editor1 = col.editor;
10                           if (fields[i] != param.field){
11                            col.editor = null;
12                           }
13                      }
14                      $(this).datagrid(‘beginEdit‘, param.index);
15                      for(var i=0; i<fields.length; i++){
16                       var col = $(this).datagrid(‘getColumnOption‘, fields[i]);
17                       col.editor = col.editor1;
18                      }
19                 });
20                }
21           });
22           var editIndex = undefined;
23           function endEditing(){
24                if (editIndex == undefined){return true}
25                if ($(‘#wingrids‘).datagrid(‘validateRow‘, editIndex)){
26                     $(‘#wingrids‘).datagrid(‘endEdit‘, editIndex);
27                     editIndex = undefined;
28                     return true;
29                } else {
30                         return false;
31                }
32           }