如何在剑道UI MVC中选择DropDownlist值和文本

Question

我有剑道下拉列表，我想选择下拉列表的选择值。我得到了选定项目的文本，但不是应该是ID的值。

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

绑定数据与Dropdown列表剑道

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

使用剑道下拉列表绑定选择函数。

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

Answer 1

在select事件中，您可以获取所选项目的基础数据项：

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

在您的情况下，值是dataItem。ID.

演示

Answer 2

就我个人而言，我喜欢用funcionallity封装代码。因此，我更喜欢这种方法：

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

检查Telerik的文档这里和这里

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