簡體   English   中英

Kendo UI網格:無法創建將添加到數據源的自定義網格編輯器

[英]Kendo UI Grid: Unable to create custom grid editor that will add to datasource

我正在嘗試創建一個自定義編輯器,以將多選控件添加為編輯器。 該列的模型中的數據通常是逗號分隔的字符串。

我可以將其添加到multiselect控件中,甚至添加用戶定義的標簽。 但是,當我從編輯器中單擊以將其關閉時,多選控件的值不會傳遞到網格以顯示在單元格中。

 function MultiselectReportUserTags(container, options) {
var newitemtext;
var tags = getTags2();
  if(options.model.ReportUserTags != undefined && options.model.ReportUserTags != "" && options.model.ReportUserTags.search(',') > -1 ) { 
      options.model.ReportUserTags = options.model.ReportUserTags.split(','); 
  }
  $("<select multiple='multiple' data-bind='value: ReportUserTags.text' />")
      .appendTo(container)
      .kendoMultiSelect({
  select: function (e) {
      debugger;
      var value = e.item.text();
      var dataitems = this.dataSource.data();
      var isNewTag = false;

      if (value.indexOf("Add new tag: ") > -1) {
          isNewTag = true;
      }

      value = value.replace("Add new tag: ", "");

      for (var i = 0; i < dataitems.length; i++) {
          var dataItem = dataitems[i];
          if (dataItem.text == value) {
              this.value().slice(0).push(value);
          }
          else if (dataItem.text.substring(0, "Add new tag: ".length) === "Add new tag: ") {
              if (isNewTag) {

                  this.dataSource.remove(dataItem);
                  this.dataSource.add({ text: value, value: value });
              }
              else {
                  this.dataSource.remove(dataItem);
              }
          }
      }

      this.refresh();
      $

  },
  change: function () {
  },
  dataBound: function () {
      if ((newitemtext || this._prev) && newitemtext != this._prev) {
          newitemtext = this._prev;

          var dataitems = this.dataSource.data();

          var isfound = false;
          for (var i = 0; i < dataitems.length; i++) {
              var dataItem = dataitems[i];

              if (dataItem.value != dataItem.text) {
                  dataItem.text = "Add new tag: " + newitemtext;
                  this.refresh();
                  isfound = true;
              }
          }
          if (!isfound) {
              this.dataSource.add({ text: "Add new tag: " + newitemtext, value: newitemtext });
              this.refresh();
          }
          this.search();
          this.open();
      }
  },
  dataSource: tags,
  dataTextField: "text",
  dataValueField: "value",
  filter: "contains",
  animation: false
  });
}

function getTags2() {

  var tagString = 'POSITION;ASSET;LOT;TRADE';
  var tagArray = tagString.split(";");
  var tags = [];
  for (var i = 0; i < tagArray.length; i++) {
      tags[i] = { text: tagArray[i], value: tagArray[i] };
  }

  return tags;

}

經過進一步研究並研究了代碼,我發現可以使用網格上的Save事件將模型值設置為multiselect編輯器中的值。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM