javascript - 剑道网格 : how to get the selected item from a Combobox cell template when using with Angular

标签 javascript angularjs kendo-ui kendo-grid

我有一个在 Angular 中使用的 Kendo 网格,并且有一个带有组合框的字段,该字段将编辑器设置为以下功能...

 function comboCellTemplate(container, options) {
  var input = $('<input name="' + options.field + '" />')
  input.appendTo(container)
  var combobox = input.kendoComboBox({
    autoBind: true,
    filter: "contains",
    placeholder: "select...",
    suggest: true,
    dataTextField: "description",
    dataValueField: "code",
    dataSource: data,
  });

数据是简单的 json 对象列表...

[
  {code: 'code1', description: 'desc1'}
  {code: 'code2', description: 'desc2'}
[

网格数据中的每个字段都绑定(bind)到相同的对象(即带有代码和描述字段)

我在上一篇文章中,为了进行排序和过滤工作,我需要将一个字段绑定(bind)到显示字段...

 {
      field: "Category.description",
      title: "Category",
      editor: comboCellTemplate,
      template: "#=Category.description#"
  },

当我这样做时,组合框似乎将网格字段设置为代码。 我如何才能将网格数据设置为整个数据对象(即{code,description})

我尝试添加一个 on-change 处理程序来执行此操作

  input.on('change', function () {
    var val = input.val();              
            //var dataItem = input.dataItem();
    options.model.set(options.field, val + 'xx');
  });

但看不到如何从组合中获取“选定的项目”

我似乎无法在帮助中找到此内容(特别是在使用 Angular 时)

如果有任何帮助,我们将不胜感激。 问候,彼得

最佳答案

我认为您可以简单地向编辑器添加一个更改处理程序并从那里设置它:

function comboCellTemplate(container, options) {
    var input = $('<input name="' + options.field + '" />')
    input.appendTo(container)
    var combobox = input.kendoComboBox({
        autoBind: true,
        filter: "contains",
        placeholder: "select...",
        suggest: true,
        dataTextField: "description",
        dataValueField: "code",
        dataSource: data,
        change: function () {
            options.model.set(options.field, this.dataItem());
        }
    });
}

关于javascript - 剑道网格 : how to get the selected item from a Combobox cell template when using with Angular,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28405048/

相关文章:

javascript - Kendo UI 网格数据源在过滤器上触发额外的 ajax 请求

javascript - 剑道数据源 : how cancel an update request

javascript - Node JS 说方法明显不存在

javascript - AngularJS 中的多个模块错误

javascript - 指令范围

javascript - 如果未通过身份验证,则在所有路由上重定向以登录

javascript - 什么是 splice.call?

javascript - -webkit-box-shadow 无法使用 javascript 正确更改

javascript - jQuery css 最小高度

javascript - Vue Tree压平数组或递归组件