как получить выбранное значение для Kendo DropDownList

Я не могу понять, как определить, какой элемент выбран в раскрывающемся списке моего кендо. Мое мнение определяет его модель как:

@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 скрытому полю формы, чтобы оно было доступно для контроллера?


kendo-ui kendo-dropdown
person ihatemash    schedule 16.05.2014    source источник
comment
В резюме: $(#myListID).data(kendoDropDownList).value();   -  person Marcus Becker    schedule 18.08.2016

Ответы (7)


arrow_upward
2
arrow_downward

Возможно, вам следует использовать конструкцию DropDownListFor для Kendo DropDownList, как в вашем представлении:

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

Таким образом, когда вы отправляете, он будет доступен для POST-запроса, и вам не нужно будет где-либо размещать скрытое поле.

НО, если вам по какой-то причине нужно использовать скрытое поле, поместите его туда, подпишитесь на событие выбора в раскрывающемся списке и поместите с помощью JQuery (например), поместите выбранный элемент в скрытое поле.

Это твой выбор :)

person Stargazer    schedule 17.05.2014
comment
Я бы понизил голос, если бы мог, но причина может заключаться в том, что запрос POST будет содержать значение, предоставленное DataTextField, а не DataValueField - person Jay K; 10.03.2016
comment
На самом деле это неправильно. Если кто-то использует DropDownListFor, привязанный к модели, почтовый запрос будет содержать выбранное значение раскрывающегося списка, содержащееся в свойстве Model, к которому привязан раскрывающийся список. - person Stargazer; 11.03.2016
comment
Вы можете увидеть это в следующем gist и просмотреть запрос, используя что-то вроде Fiddler. - person Stargazer; 11.03.2016
comment
Не уверен, почему кто-то проголосовал за это... было бы неплохо получить какую-то причину по этому поводу.... :^) - person Stargazer; 05.04.2021

arrow_upward
30
arrow_downward

Для тех, кто нашел это интересно, как получить выбранное значение в JavaScript, это правильный ответ:

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

Из документации: http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value

person Brian MacKay    schedule 19.08.2016
comment
Брайан - спасибо за ответ. Вы правы в отношении доступа к значению с помощью метода value(). Однако в этом случае мне нужно было получить доступ к значению в моем контроллере, а не к представлению. Прошло 2 года с тех пор, как я опубликовал этот вопрос. Итак, я иду по памяти (и плохой в этом). Но я почти уверен, что использование DropDownListFor передало значение обратно моему контроллеру. - person ihatemash; 19.08.2016
comment
Я видел это, просто я несколько раз оказывался здесь, пытаясь вспомнить, как это сделать в JavaScript, поэтому я решил просто поместить ответ здесь. - person Brian MacKay; 19.08.2016
comment
это не работает для меня, я получаю [obj, obj] в качестве значения. - person luisluix; 19.04.2017
comment
@luisluix работает для меня, и это то, что есть в документах - не знаю, что вам сказать. :/ Вы уверены, что не использовали val() или что-то в этом роде? - person Brian MacKay; 19.04.2017
comment
Кажется, это не работает для меня в IE11 - person svict4; 07.05.2021

arrow_upward
11
arrow_downward

при выборе значения из раскрывающегося списка и в событии 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
    }

Я верю, что это поможет кому-то

Спасибо

person dush88c    schedule 16.07.2015
comment
Именно то, что мне было нужно! Спасибо - person Dave; 11.02.2019

arrow_upward
5
arrow_downward

Привет, я просто решал эту проблему, продолжал искать 2 часа и придумал собственное решение.

Итак, вот строка для получения любых данных, запрошенных в раскрывающемся списке кендо.

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

Просто измените идентификатор клиентов на идентификатор, который вы дали в раскрывающемся списке кендо.

person Lakshaya Maheshwari    schedule 07.10.2016
comment
если вы сделаете это, вам нужно вычесть единицу из выбранного индекса, так как индекс будет на 1 больше, чем позиция в массиве Пример: $(#customers).data(kendoDropDownList).selectedIndex - 1 - person abovetempo; 24.01.2019

arrow_upward
2
arrow_downward

Если вы хотите также прочитать текст раскрывающегося списка, вы можете получить или установить значение, используя следующую функцию кендо:

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

ССЫЛКА НА ДОКУМЕНТАЦИЯ

Использование этого .val(), как упоминает @Vivek Parekh, не сработает - в структуре кендо нет функции .val().

Если вы хотите, вы можете использовать jQuery и вернуть значение: $('#EncounterTypes').val()

person JasminB    schedule 12.09.2019

arrow_upward
0
arrow_downward

Обновленная ДЕМО

$("#EncounterTypes").kendoDropDownList().val();
person Vivek Parekh    schedule 17.05.2014
comment
Боюсь, за это не следует голосовать. Вызов .kendoDropDownList() фактически повторно инициализирует элемент управления, который в моем случае, когда я выполняю привязку AJAX, удалил из него все данные. Я опубликовал ответ, который должен работать во всех случаях. - person Brian MacKay; 19.08.2016

arrow_upward
0
arrow_downward

Вы можете получить выбранный элемент, как показано ниже, а затем использовать item.property для получения дополнительной информации.

var selectedFooType = $("#fooType").data("kendoDropDownList").dataItem();
    selectedFooType.name 
//OR
    selectedFooType.id
person shubh gaikwad    schedule 02.06.2021