igGrid列编辑模板

Question

igGrid是否支持列编辑/新建模板？

我有一个定义如下的网格。但在编辑/添加新行时，模板将不起作用。"ChooseEmployee“功能显示一个弹出对话框，供用户从中选择员工。

​

$(function() {
  var employees = [{
    Id: 1,
    "Name": "John, Smith",
    "DirectReports": "Mary, Ann;David,Lowe"
  }, {
    Id: 2,
    "Name": "Mary, Ann",
    "DirectReports": "Kelly,Walsh;Kevin, Edwards;Terri, Gibson"
  }];
 
  $('#grid1').igGrid({
    dataSource: employees,
    primaryKey: "Id",
    autGenerateColumns: false,
    width: "100%",
    columns[{
      headerText: "Id",
      key: "Id",
      dataType: "number",
      width: 100
    }, {
      headerText: "Name",
      key: "Name",
      dataType: "string",
      width: 120
    }, {
      headerText: "Reports",
      key: "DirectReports",
      dataType: "object",
      width: 300,
      template: "<div style='clear:both'><div style='overflow:hidden;white-space:wrap;max-width:320px;width:320px;float:left;'>${DirectReports}</div><input type='button' onclick='chooseEmployees(${Id});' value='...' style='float:left;' /></div>"
    }], 
   features: [ {name: "Updating", enableAddRow: true, editMode: "row" } ] 
  });

});

<table id="grid1"></table>

​

Answer 1

基本上，您必须取消igGrid正在执行的原始行编辑，并且必须以编程方式调用行更新和行添加。此外，此模板将适用于已存在的行，但不会在添加新行时应用。您可以尝试使用igGrid在框编辑对话框中提供的行编辑模板功能。如果要从该特定列的值列表中进行选择，则可以使用该列的组合编辑器提供程序。

Option for configuring editor provider for the column.

updateRow API method.

addRow API method.

Setting up a row edit template.