Kendo Grid:与 Angular 一起使用时如何从组合框单元格模板中获取所选项目 [英] Kendo Grid: how to get the selected item from a Combobox cell template when using with Angular

问题描述

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

 function comboCellTemplate(container, options) {var input = $('<input name="' + options.field + '"/>')input.appendTo(容器)var 组合框 = input.kendoComboBox({自动绑定:真，过滤器:包含"，占位符:选择..."，建议:真的，数据文本字段:描述"，数据值字段:代码"，数据源:数据，});

而 data 是一个简单的 json 对象列表...

<预><代码>[{代码:'code1'，描述:'desc1'}{代码:'code2'，描述:'desc2'}[

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

我之前的一篇文章，为了让排序和过滤工作，我需要将一个字段绑定到显示字段...

<代码> {字段:类别.描述"，title: "类别",编辑器:comboCellTemplate，模板:#=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(容器)var 组合框 = input.kendoComboBox({自动绑定:真，过滤器:包含"，占位符:选择..."，建议:真的，数据文本字段:描述"，数据值字段:代码"，数据源:数据，改变:函数(){options.model.set(options.field, this.dataItem());}});}

I have a Kendo grid which I am using within Angular, and have a field with a combo box, that has the editor set to the following function...

 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,
  });

And data is a list of simple json objects...

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

Each field in the grid data is bound to the same objects (ie with a code and description field)

I a previous post, to get sorting and filtering working I need to bind a field to the display field...

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

When I do this, the combo box seems to set the field of the grid to the code. How can I get this to set the grid data to the whole data object (ie the {code, description})

I have tried adding a on - change handler to do this

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

but can't see how to get the "selected Item" from the combo

I don't seem to be able to find this in the help (in particular when using Angular)

Any help here would be greatly appreciated. regards, Peter

解决方案

I think you can simply add a change handler to the editor and set it from there:

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());
        }
    });
}

这篇关于Kendo Grid:与 Angular 一起使用时如何从组合框单元格模板中获取所选项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！