如何在列表视图中获取 kendo ui 下拉列表选定值的值答案

【问题标题】：how to get the value of a kendoui dropdown list selected value in a listview如何在列表视图中获取 kendo ui 下拉列表选定值的值
【发布时间】：2012-10-31 04:55:41
【问题描述】：

我有一些由 kendoui 下拉列表组成的 kendoui 列表视图，我想获取这些下拉列表中的选定值。为此，我正在尝试，

 $("#cnty1").val();

这是我的下拉列表，即来自数据库表的国家/地区列表，

<input select STYLE="width:90px;height:auto" id ="cnty1" data-bind="value:cnty1" 
name="cnty1" data-type="string" data-text-field="cnty" 
data-value-field="cntyid" data-source="sourcedata1" class="k-d"   
data-role="dropdownlist" />

<span data-for="cnty1" class="k-invalid-msg"></span>

这里 cnty1 是下拉列表的 id，但我没有得到值，而是得到了选定值的“id”，而不是选定值。

如果未选择该值，则使用 $("#cnty1").val(); 获取第一个值 id

所以，请给我一个解决方案，以便， 1）我应该只得到 Selected 值和 2) 下拉列表的值仅当用户从列表中选择了一个值，但不选择时不获取列表的值。

【问题讨论】：

标签： c# asp.net-mvc-3 kendo-ui

【解决方案1】：

试试这个。

<select STYLE="width:90px;height:auto" id ="cnty1" data-bind="value:cnty1" 
data-text-field="cnty" data-value-field="cntyid" data-source="sourcedata1" data-role="dropdownlist" data-change="cntySelect" data-option-label="Select"></select>

function cntySelect(e) {                                                
          var dropDownVal = $("#cnty1").val();
            alert(dropDownVal);
}

【讨论】：

【解决方案2】：

使用以下 jquery 获取选定的值/文本：

对于价值：
$("#cnty1 option:selected").val();

文本使用：
$("#cnty1 option:selected").text();

【讨论】：

感谢您的回答，但对于价值：$("#cnty1 option:selected").val();我得到“未定义”和 text:$("#cnty1 option:selected").text();什么都得不到。
您好，因为您的下拉菜单名称是 cnty1。它不是 id。所以请给下拉列表提供一些有效的 id，例如 id="cntDropDown" 并在 jquery 中使用它，例如：$("#cntDropDown option:selected").val();

【解决方案3】：

虽然此代码用于 KendoUI 网格中的 FK JSON 对象，但其想法是相似的。您必须在下拉值选择中绑定对象。下拉列表本质上包含作为您的值 ID 的选项，而不是对象本身。因此，您必须遍历数据源以查找已选择的对象，然后在数据模型中进行替换。

/**
 * KendoDropDownEditor Class
 * */
var KendoDropDownEditor = Class({

    initialize: function (schema, gridId, readUrl) {

        var readUrl = readUrl || base + schema.entityName + "/read";
        this.dataSource = DataSourceGenerator.crudDS(schema, gridId, readUrl);

        this.dataTextField = schema.model.dropDownTextField;
        this.dataValueField = schema.model.id;
    },

    /**
     *
     * */
    do:function (container, options) {
        var self = this;
        var a = $('<input data-text-field="' + self.dataTextField + '" data-value-field="' + self.dataValueField + '" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                autoBind:false,
                dataSource:self.dataSource,
                close:function (e) {
                    $.each(self.dataSource.data(), function(key, value) {
                        if (value[self.dataValueField] == e.sender.value()) {
                            options.model[options.field] = value;
                            return false;
                        }
                    });
                }
            });
    }
});

也可以看看Knockout-Kendo，它可以让你的生活更轻松。

【讨论】：