web-dev-qa-db-ja.com

剣道マルチセレクトの選択された値を取得する方法は?

次のように剣道マルチセレクトを使用していますが、選択した値を取得できません

var multiselect = $("#SelectRoles").data("kendoMultiSelect");
var selectedData= [];
var items = multiselect.value();
for (var itm in items)
{
   selectedData.Push(itm);
}

しかし、配列selectedDataは、値ではなく複数選択の項目のインデックスを返します。

8
Omar Seleim

Value()メソッドから返された配列を変数に直接割り当てることもできます。例:

var ms = $("#multiselect").kendoMultiSelect({
  value: ["1", "2"]
}).data('kendoMultiSelect');

var selectedItems = ms.value();
console.log(selectedItems); // ["1", "2"]
2
topalkata

これを使用すると、インデックスが返されます。

var multiselect = $("#SelectRoles").data("kendoMultiSelect");
var selectedData= [];
var items = multiselect.value();
for (var i=0;i<items.length;i++)
{
   selectedData.Push(items[i]);
}
2
volvox

元のコードに問題はありません。インデックスのみを取得していますか?おそらく、MultiSelectコードも投稿する必要があります。同じ問題があり、他の回答を参照に使用したため、この質問を見つけましたが、複雑すぎることがわかりました。だから私に別の複雑な方法で答えさせてください:)

これが私が持っているものです。必要以上のコードであることはわかっていますが、ここで全体像を確認することが重要だと思います。まず、これを設定しましょう。 Kendo()。MultiSelect.Name( "SomeName")プロパティを複数回使用している場合は、問題があります。 「名前」はhtml名だけでなくIDも設定します。同じ識別子を持つ2つのIDが必要になることはありません。したがって、私のコードでは、一意のIDを確保するために、MultiSelect.Nameプロパティに一意のIDを追加しています。人のテーブルの各行にMultiSelectを配置しています。選択した値(UIに表示されるテキストではない)を取得できるように、DataValueFieldプロパティを使用していることを確認するためにこれを示しています。 IDのないテキスト値のリストを表示しているだけの場合、おそらくそれが間違ったデータを取得している理由ですか?

@foreach (var cm in Model.CaseMembers)
{
<tr>
<td>
    @(Html.Kendo().MultiSelect()
      .Name("IsDelegateFor" + cm.CaseMemberId)                              
      .Placeholder("is a delegate for..")
      .DataTextField("FullName")
      .DataValueField("CaseMemberId")
      .BindTo(Model.Attorneys)
    )
</td>
</tr>
}

次に、後でjQueryで、MultiSelectの選択された値の配列であるDataValueField(CaseMemberId)を抽出しようとします...

var sRows = [];
$('#cmGrid tr').each(function () {
    // 'this' is a tr
    $tr = $(this);
    // create an object that will hold my array of selected values (and other stuff)
    var rec = {};   
    rec.IsADelegateFor = [];        
    // loop over all tds in current row
    $('td', $tr).each(function (colIndex, col) {
        if (colIndex === 3) {
            // make sure our MultiSelect exists in this td
            if ($(this).find("#IsDelegateFor" + rec.CaseMemberId).length) {                        
                // it exists, so grab the array of selected ids and assign to our record array
                rec.IsADelegateFor = $(this).find("#IsDelegateFor" + rec.CaseMemberId).data("kendoMultiSelect").value();                        
            }
        }
    }
    // add this tr to the collection
    sRows.Push(rec);
}

したがって、これはすべて、この1行がIDを取得するために完全に機能することを述べた、非常に詳細な方法です。 .value()配列を反復処理して、コンテンツを別の配列にプッシュする必要はありません。

rec.IsADelegateFor = $(this).find("#IsDelegateFor" + rec.CaseMemberId).data("kendoMultiSelect").value();  

したがって、元のコードでは、以下が機能しない理由はありません。

var multiselect = $("#SelectRoles").data("kendoMultiSelect");
var selectedData = [];
selectedData = multiselect.value();
console.log(selectedData);

でなければ

  • multiValueがDataValueFieldを使用してC#で適切に設定されていない
  • まったく同じIDを持つ複数のMultiSelectがページ上にあり、思っているものとは異なるものから読み取っています。
  • テキストのリストだけで、値フィールドすらありません。
1
redwards510

Volvoxによって与えられたソリューションが機能します。

以下はjqueryバージョンです、

var multiselect = $("#SelectRoles").data("kendoMultiSelect");
var selectedData= [];
var items = multiselect.value();
$.each(items ,function(i,v){
  selectedData.Push(v);
});
0