Question

我无法弄清楚如何确定在我的剑道下拉列表中选择了哪个项目。我的观点将其定义为：

@model KendoApp.Models.SelectorViewModel

ViewModel定义为：

public class SelectorViewModel
{
    //I want to set this to the selected item in the view
    //And use it to set the initial item in the DropDownList
    public int EncSelected { get; set; }

    //contains the list if items for the DropDownList
    //SelectionTypes contains an ID and Description
    public IEnumerable<SelectionTypes> ENCTypes
}

在我看来我有：

@(Html.Kendo().DropDownList()
                    .Name("EncounterTypes")
                    .DataTextField("Description")
                    .DataValueField("ID")
                    .BindTo(Model.ENCTypes)
                    .SelectedIndex(Model.EncSelected)
                )

此DropDownList包含我期望的值，但是当用户单击提交按钮时，我需要将所选值传递回控制器。一切正常，但我无法访问从控制器的[HttpPost]操作中选择的项目。那么，如何将DropDownList的值分配给隐藏的表单字段，以便控制器可以使用它？

Answer 1

对于那些发现这种想知道如何在JavaScript中获取所选值的人来说，这是正确的答案：

$("#EncounterTypes").data("kendoDropDownList").value();

来自文档：http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value

Answer 2

从下拉列表中选择一个值时，在selec事件中，我们可以获得如下所选的值，

@(Html.Kendo().DropDownList()
              .Name("booksDropDown")
              .HtmlAttributes(new { style = "width:37%" })
              .DataTextField("BookName")
              .DataValueField("BookId")
              .Events(x => x.Select("onSelectBookValue"))
              .DataSource(datasource => datasource.Read(action => action.Action("ReadBookDropDow", "PlanningBook").Type(HttpVerbs.Get)))
              .OptionLabel("Select"))

javascript函数如下，

   function onSelectBookValue(e) {    

                    var dataItem = this.dataItem(e.item.index());
                    var bookId = dataItem.BookId;
                 //other user code
    }

我相信这会对某人有所帮助

由于

Answer 3

您好我刚刚遇到这个问题，继续搜索了2个小时，然后提出了我自己的解决方案。

所以这里是获取任何数据bidden到kendo下拉列表的行。

$("#customers").data("kendoDropDownList").dataSource._data[$("#customers").data("kendoDropDownList").selectedIndex].colour;

只需将ID客户更改为您已授予kendo下拉的ID。

Answer 4

也许您应该在视图中使用Kendo DropDownList的DropDownListFor构造：

@(Html.Kendo().DropDownListFor(m => m.EncSelected)
                    .Name("EncounterTypes")
                    .DataTextField("Description")
                    .DataValueField("ID")
                    .BindTo(Model.ENCTypes)
                    .SelectedIndex(Model.EncSelected)
                )

这样，当您提交时，它将在POST请求中可用，您不需要在任何地方放置隐藏字段。

但是你应该出于某种原因需要使用隐藏字段，把它放在下拉列表的subscribe the the select event中，并使用JQuery（例如）将所选项放在隐藏字段上。

这是你的选择：）

Answer 5

如果您还想读出下拉菜单的文本，则可以使用以下kendo函数获取或设置该值：

$('#EncounterTypes').data("kendoDropDownList").text();

REFERENCE TO THE DOCUMENTATION

使用@Vivek Parekh提到的.val()无效-kendo框架中没有函数.val（）。

如果需要，可以使用jQuery并取回值：$('#EncounterTypes').val()

Answer 6

Updated DEMO

$("#EncounterTypes").kendoDropDownList().val();

Answer 7

您可以像下面的代码一样获取选中的项目，然后使用 item.property 获取更多信息

var selectedFooType = $("#fooType").data("kendoDropDownList").dataItem();
    selectedFooType.name 
//OR
    selectedFooType.id

如何获得Kendo DropDownList的选定值

7 个答案: