web-dev-qa-db-ja.com

Kendo UIでドロップダウンの選択されたアイテムのテキストを取得する方法は？

Kendo UIコントロールを使用しています。 jqueryのドロップダウンリストの選択されたテキストを取得したい。私はこの構文を使用しました：

 $("#ddl").data("kendoDropDownList").text();

IEを除くすべてのブラウザーでテキストを取得できます。 IEでこれが機能しない理由がわかりません。手伝ってください。選択したテキストを取得する他の方法はありますか？

asp.netkendo-uidropdownboxkendo-dropdown
29
Ram Singh

DropDownListのテキスト値を取得するには、次のコマンドを使用します。

$("#ddl").data("kendoDropDownList").text();
43
Dinesh Haraveer

DropDownListsの場合、DisplayTextとValueを含めます。 DisplayTextはユーザーが選択するもので、Valueはバックエンドで使用されるものです。

例：連絡先情報を保存するデータベースがあり、DisplayTextが連絡先名になり、値がデータベース内のその特定の行の主キーIDフィールドになります。

ID-1名前-ジョン・スミス

$("#ddl").data("kendoDropDownList").dataItem().DisplayText = John Smith
$("#ddl").data("kendoDropDownList").dataItem().Value = 1

これが私がやろうとしていたことです。これもあなたが探していた答えだと思います。

5
Zach

フィドル は試してみたい人です

<select id="testDrpDown">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="1231231">and so on</option>
</select>
</br>
</br>
<button onclick="MethOne()">Method one</button>
</br>
</br>
<button onclick="Methtwo()">Method one</button>

<script>
$("#testDrpDown").kendoDropDownList();

//var can be used anuwhere in js
var dropdown = $("#testDrpDown").data("kendoDropDownList");

function MethOne() {
    alert($("#testDrpDown").data("kendoDropDownList").text());
}

function Methtwo() {
    alert(dropdown.text());
}
</script>
2
karthickj25

別の方法を次に示します。

e.item[0].textContent

完全な例：

$("#ancillaryTestDDL").kendoDropDownList({
    dataSource: that.viewModel.ancillaryTestDS,
    dataTextField: "DisplayValue",
    dataValueField: "Id",
    select: function (e) {
        console.log(e.item);
        console.log(e.item[0].textContent);
    }
});
1
user1477388

SelectイベントでDropdownlistから値を選択すると、選択した値は次のように利用できます、

@(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; // value of the dropdown
                var bookName = dataItem.BookName; // text of the dropdown
               //other user code
}

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

ありがとう

1
dush88c

あなたはこのように試すことができます

 var ddl= $("#ddl").data("kendoDropDownList").dataItem($("#ddl").data("kendoDropDownList").select()).FieldName;
//FieldName is the text field of DataSource ---  .DataTextField("FieldName")
1
MustafaP

D.popovに同意します。あなたの質問が答えのようです。ステートメントをアラート関数に配置すると、選択したテキストがポップアップ表示されます。

Alert（$（ "＃ddl"）。data（ "kendoDropDownList"）。text（））;

IE11でテスト済み。実際のIE問題に関連するバージョンは言及されていません...

0
IUnknown