web-dev-qa-db-fra.com

comment obtenir la valeur sélectionnée pour Kendo DropDownList

Je ne sais pas comment déterminer quel élément est sélectionné dans la liste déroulante my kendo. Ma vue définit son modèle comme:

@model KendoApp.Models.SelectorViewModel

Le ViewModel est défini comme:

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
}

et à mon avis, j'ai:

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

Cette DropDownList contient les valeurs que j'attends, mais je dois transmettre la valeur sélectionnée à mon contrôleur lorsque l'utilisateur clique sur le bouton Soumettre. Tout fonctionne bien, sauf que je n'ai pas accès à l'élément sélectionné dans l'action [HttpPost] du contrôleur. Alors, comment puis-je attribuer la valeur de DropDownList à un champ de formulaire masqué afin qu'il soit disponible pour le contrôleur?

kendo-uikendo-dropdown
7
ihatemash

Vous devriez peut-être utiliser la construction DropDownListFor de Kendo DropDownList comme ceci à votre avis:

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

De cette façon, lorsque vous soumettez, il sera disponible sur la demande POST et vous n'aurez pas besoin de mettre un champ caché n'importe où.

MAIS si vous avez besoin d'utiliser le champ caché pour une raison quelconque, placez-le là, abonnez-vous à l'événement select de la liste déroulante et mettez à l'aide de JQuery (par exemple) placez l'élément sélectionné sur le champ caché.

C'est ton choix :)

3
Stargazer

Pour quiconque a trouvé cela se demandant comment obtenir la valeur sélectionnée en JavaScript, voici la bonne réponse:

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

De la documentation: http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value

20
Brian MacKay

lorsque vous sélectionnez une valeur dans une liste déroulante, et dans l'événement selec, nous pouvons obtenir la valeur sélectionnée comme suit,

@(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"))

fonction javascript comme suit,

   function onSelectBookValue(e) {    

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

Je crois que cela aidera quelqu'un

Merci

9
dush88c

Bonjour, je venais de traverser ce problème, j'ai continué à chercher pendant 2 heures et j'ai trouvé ma propre solution.

Voici donc la ligne pour récupérer toutes les données du menu déroulant du kendo.

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

Remplacez simplement l'id clients par l'identifiant que vous avez donné à la liste déroulante de kendo.

5
Lakshaya Maheshwari

Si vous souhaitez lire également le texte de la liste déroulante, vous pouvez obtenir ou définir la valeur en utilisant la fonction kendo suivante:

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

REFERENCE A LA DOCUMENTATION

Utiliser cette .val() comme le mentionne @Vivek Parekh ne fonctionnera pas - il n'y a pas de fonction .val () dans le framework kendo.

Si vous le souhaitez, vous pouvez utiliser jQuery et récupérer la valeur: $('#EncounterTypes').val()

1
JasminB

DEMO mise à jour

$("#EncounterTypes").kendoDropDownList().val();
0
Vivek Parekh