在选定的kendo网格mvvm中获取kendo下拉列表值/文本/索引

Question

我可以通过以下模板方案将kendo下拉列表添加到kendo网格中:

<script type="text/x-kendo-template" id="ddlGrid">
    <input data-role="dropdownlist"
       data-text-field="Text"
       data-value-field="Value"
       data-bind="source: actionSource, events: { change: onChange}"/>
</script>
<div class="demo-section">
<div class="k-content" style="width: 100%">
    <div id="grid"
         data-role="grid"
         data-sortable="true"
         data-selectable="true"
         data-columns="[
            { field: 'ProductID' },
            { field: 'ProductName' },
            { field: 'UnitPrice' },
            { field: 'UnitsInStock' },
            { field: 'Discontinued' },
            { title: 'Action', template: kendo.template($('#ddlGrid').html())} ]"
         data-bind="source: dataSource, event">
    </div>
</div>

但是,问题是如何访问该下拉列表以获取值/文本/索引.到目前为止,我可以使用这种方法获取选定的行数据:

var onClick = function (event, delegate) {
  event.preventDefault();
  var grid = $("#grid").data("kendoGrid");
  var selectedRow = grid.select();
  var dataItem = grid.dataItem(selectedRow);
  if (selectedRow.length > 0)
    delegate(dataItem);
  else
    alert("Please select a row.");
  };

var viewModel = new kendo.data.ObservableObject({
    dataSource: productDatasource,
    actionSource: actionDataSource,

    onChange: function (event) {
        onClick(event, function (dataItem) {
            alert(dataItem.ProductID + " " + dataItem.ProductName);
        });            
    },

});

这是JSFiddle代码

请帮助我,我被困住了.

提前致谢.

Answer 1

您可以使用以下方法访问DropDownList文本和值:

var value = event.sender.value();
var text = event.sender.text();

在你的onChange功能里面:

onChange: function (event) {
    alert ("Text/Value : " + event.sender.text() + "/" + event.sender.value());
    onClick(event, function (dataItem) {
        alert(dataItem.ProductID + " " + dataItem.ProductName);
    });            
},

但是onClick,当你可以让dataItem简单地执行时,我实际上不确定为什么要定义所有复杂的代码？

var viewModel = new kendo.data.ObservableObject({
    dataSource: productDatasource,
    actionSource: actionDataSource,

    onChange: function (event) {
        alert ("Text/Value : " + event.sender.text() + "/" + event.sender.value());
        var grid = $("#grid").data("kendoGrid");
        var dataItem = grid.dataItem($(event.sender.wrapper).closest("tr"));
        alert(dataItem.ProductID + " " + dataItem.ProductName);
    },

});
kendo.bind($("#grid"), viewModel);

在这里看到:http://jsfiddle.net/OnaBai/hLG98/12/