web-dev-qa-db-ja.com

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-uikendo-dropdown
7
ihatemash

たぶんあなたはあなたのビューでそのように剣道のDropDownListのDropDownListFor構造を使用しているはずです：

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

このように、送信すると、POSTリクエストで利用可能になり、非表示フィールドをどこにも配置する必要がなくなります。

しかし、何らかの理由で非表示フィールドを使用する必要がある場合は、ドロップダウンリストの selectイベントをサブスクライブ し、JQueryを使用して（たとえば）選択したアイテムを非表示フィールドに配置します。

それはあなたの選択です:)

3
Stargazer

これがJavaScriptで選択された値を取得する方法を疑問に思っている人にとって、これは正しい答えです：

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

ドキュメントから： http://docs.telerik.com/kendo-ui/api/javascript/ui/dropdownlist#methods-value

20
Brian MacKay

ドロップダウンリストから値を選択すると、選択したイベントで次のように選択した値を取得できます。

@(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
    }

これは誰かを助けると信じています

ありがとう

9
dush88c

こんにちは私はちょうどこの問題を経験していました、2時間の検索を続け、自分自身の解決策を考え出しました。

剣道のドロップダウンにビッドされたデータをフェッチするための行です。

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

お客様のIDを、剣道のドロップダウンで指定したIDに変更するだけです。

5
Lakshaya Maheshwari

ドロップダウンのテキストも読みたい場合は、次の剣道関数を使用して値を取得または設定できます。

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

ドキュメントへの参照

@Vivek Parekhが言及しているように、この.val()を使用しても機能しません。剣道フレームワークには関数.val（）がありません。

必要な場合は、jQueryを使用して値を取得できます：$('#EncounterTypes').val()

1
JasminB

更新されたデモ

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