easyui 创建可编辑的表格

$('#infodatagrid').datagrid({
    nowrap: false,
    striped: true,
    loadMsg:'数据加载中请稍后……',
    url:'<c:url value="/jxc/depot/findImportDocumentInfo.jsps?documentId="/>'+'<c:out value="${d.documentId}"/>',
    collapsible:true,
       singleSelect:true,
       showPageList: true,
                pageSize: 20,  
    frozenColumns:[[
                 {title:'选择',field:'infoId',width:30,checkbox:true}
    ]],
    columns:[[
     {field:'matCode',title:'料号',width:100},
     {field:'matName',title:'产品名称',width:100},
     {field:'matStandard',title:'规格',width:100},
     {field:'matLibNumber',title:'当前库存量',width:100},
     {field:'documentNumber',title:'数量',width:50,editor:'numberbox'},
     {field:'documentFunction',title:'用途',width:70,
      editor:{
       type:'combobox',
       options:{
                       valueField:'id',
                       textField:'text',
                       required:true,
                       editable:false
                   }
      },
      formatter:function(value,rowData,index){ 
                          for(var i=0; i < comboboxData_.length; i++){
        if(value == comboboxData_[i].id){
         return comboboxData_[i].text;
        }
       }
                      } 
      },
     {field:'opt',title:'操作',width:180,
       formatter:function(value,rowData,index){ 
                          var a = '<a href="#" onclick="editInfo(\''+ index + '\')">编辑</a>&nbsp;&nbsp;';
                          var b = '<a href="#" onclick="saveInfo(\''+ index + '\')">保存</a>&nbsp;&nbsp;';   
                          var c = '<a href="#" onclick="delInfo(\''+ index +'\')">删除</a>';
                          var d = '<span class="red" style="display: none" id="'+index+'">保存成功</span>';
                          return a+b+c+d; 
                      } 
                   }
    ]],
    onBeforeEdit:function(index,row){
           row.editing = true;
       },
       onAfterEdit:function(index,row){
           row.editing = false;  
       },
       onCancelEdit:function(index,row){
           row.editing = false;
       },
    //pagination:true,
    rownumbers:true
   });

 

 

//入库明细行编辑
  function editInfo(index){
   $('#infodatagrid').datagrid('acceptChanges'); //让表格接受改变的数据 
   $('#infodatagrid').datagrid('clearSelections'); //首先清空所以选择
   $('#infodatagrid').datagrid('beginEdit', index);
   $('#infodatagrid').datagrid('selectRow',index); //编辑时 选择这一行
   
   //当编辑时,加载下拉框数据
    var amount = $('#infodatagrid').datagrid('getEditor', {index:index, field:'documentFunction'}).target;
   amount.combobox("loadData", comboboxData_);
   $("#"+index).hide(); //隐藏消息提示
  }

 

 

 

<table id="infodatagrid"></table>

你可能感兴趣的:(C++,c,C#)