向SlickGrid添加新行

我有一个使用数据视图的slickgrid。从我所知道的情况来看，网格的添加新行事件在第一个新行字段的编辑器完成之后才会调用。我正在编辑的字段是自定义编辑器，它使用带有自动完成功能的输入框并将所选项目“值”保存到网格源数据。问题是新的“项目”源不会创建，直到网格添加新行事件被触发。我知道有一种解决方法，只是想知道什么是解决这个问题的最佳方法。向SlickGrid添加新行

谢谢。

//Add new row event 

grid.onAddNewRow.subscribe(function (e, args) { 
         var item = args.item; 
         addnewid = addnewid - 1; 
         item.inventorytransferdetailid = addnewid;       
         $.extend(item, args.item); 
         dataView.addItem(item); 
        }); 

// Custom editor 
function Suggest2(args) { 
    var $input; 
    var defaultValue; 
    var scope = this; 
    this.init = function() { 
     $input = $("<INPUT type=text class='editor-text' />") 
     $input.width = args.column.width; 
     $input.appendTo(args.container); 
     $input.focus(); 
     $input.bind("keydown.nav", function (e) { 
      if (e.keyCode === $.ui.keyCode.LEFT || e.keyCode === $.ui.keyCode.RIGHT) { 
       e.stopImmediatePropagation(); 
      } 
      else if ($input.val().length > 0) { 
       $.ajax({ 
        type: "GET", 
        url: "http://localhost:11111/GetProducts/" + $input.val(), 
        dataType: "json", 
        data: "{}", 
        contentType: "application/json; charset=utf-8", 
        success: function (data) { 
         $input.autocomplete({ 
          source: data, 
          select: function (event, ui) { 
           var v = ui.item.value; 
           var l = ui.item.label; 
           //Set "display" field with label 
           args.item[args.column.field] = l; 
           this.value = l; 
           //Set "hidden" id field with value 
           args.item["productid"] = v; 
           return false; 
          } 
         }); 
        }, 
        error: function (XMLHttpRequest, textStatus, errorThrown) { 
         alert(textStatus); 
        } 
       }); 
      } 
     }) 
    }; 
    this.destroy = function() { 
     $input.remove(); 
    }; 

    this.focus = function() { 
     $input.focus(); 
    }; 



    this.getValue = function() { 
     return $input.val(); 
    }; 



    this.setValue = function (val) { 
     $input.val(val); 
    }; 

    this.loadValue = function (item) { 
     defaultValue = item[args.column.field] || ""; 
     $input.val(defaultValue); 
     $input[0].defaultValue = defaultValue; 
     $input.select(); 
    }; 



    this.serializeValue = function() { 
     return $input.val(); 
    }; 


    this.applyValue = function (item, state) { 
     //item[args.column.field] = state; 
    }; 



    this.isValueChanged = function() { 
     return (!($input.val() == "" && defaultValue == null)) && ($input.val() != defaultValue); 
    }; 



    this.validate = function() { 
     if (args.column.validator) { 
      var validationResults = args.column.validator($input.val()); 
      if (!validationResults.valid) { 
       return validationResults; 
      } 
     } 



     return { 
      valid: true, 
      msg: null 
     }; 
    }; 
    this.init(); 
}

来源

2012-04-21 user1347790

当您的自定义编辑器完成而不是依赖事件处理程序时，您不能只调用dataView.additem（）方法吗？ – DanJGer 2014-01-23 15:55:42

您可以尝试下面的代码。

function add_new_row(){ 
item = { 
     "id": (Math.round(Math.random()*-10000)) 
    }; 
data_view.insertItem(0, item); 
}

然后，用按钮绑定。

<button onclick="add_new_row()">Add Row</button>

来源

2014-02-04 11:13:40 HeiN

向SlickGrid添加新行

回答

相关问题