如何 select kendo UI MVC 中的下拉列表值和文本

Question

我有 Kendo DropDown 列表，我想 Select DropDownList Selection 上的值。我得到的是 Selected Item 的文本，但不是应该是 ID 的值。

function onSelect(e) {
        var item = e.item;
        var v = e.value;
        var text = item.text();
        alert(text);
        alert(v);
    };

使用下拉列表绑定数据kendo

$("#FirstName").kendoDropDownList({
        dataTextField: "Fname",
        dataValueField: "Id",
        dataSource: dataSoucceAll,
    });

绑定 select 函数与 kendo 下拉列表。

    var dropdownlist = $("#FirstName").data("kendoDropDownList");
    dropdownlist.bind("select", onSelect);

Answer 1

就我个人而言，我喜欢通过功能封装代码。出于这个原因，我更喜欢这种方法：

$("#FirstName").kendoDropDownList({
    dataTextField: "Fname",
    dataValueField: "Id",
    dataSource: dataSoucceAll,
    /* Event select */
    select: function (e) {
       var item = e.item;    // item has selected value
       /* logic here*/
    }
});

检查 telerik 文档 here and here

Answer 2

在select事件中，可以得到selected项的底层dataItem：

   var dataitem = e.sender.dataItem(e.item);
   alert(dataitem.Id);

在您的情况下，值为 dataItem.Id。

DEMO

Answer 3

谢谢大家。我也得到了一些解决方案。

  function onSelect(e) {
       //selecting ID from the dropdown list
        var dataItem = this.dataItem(e.item.index());
        var BId = dataItem.Id;


        //Binding with the grid.
        var alg = $("#allgrid").data("kendoGrid").dataSource;

        //Filtering gird with the Id
        if (BId) {
            alg.filter([
                 {
                    "logic": "eq",
                    "filters": [
                        {
                            "field": "Id",
                            "operator": "eq",
                            "value": BId
                        }
                    ]
                }
            ])
        }
        else {
            alg.filter({});
        } 
    };

    //Binding dropdownlist with database
    $("#FirstName").kendoDropDownList({
        dataTextField: "Fname",
        dataValueField: "Id",
        dataSource: dataSoucceAll,
    });

    //Bind Select function with kendo Dropdown list
    var dropdownlist = $("#FirstName").data("kendoDropDownList");
    dropdownlist.bind("select", onSelect);