2

mvc で剣道 ui オートコンプリート ウィジェットを使用しています。

私のindex.cshtmlファイルは次のとおりです。

<div class="filter-value">
    @(Html.Kendo().AutoComplete()
    .Name("InspectorId")
    .DataTextField("RPersonDetails") 
    )
</div>

ここにデータ ソースを配置するのではなく、javascript でバインドします。

私のjavascriptコードは次のとおりです。

wireEvents: function () {

    $("#InspectorId").bind("keyup", function () { AISApp.Page.populateDropDown($(this).val()) });
},


populateDropDown: function (value) {

    var dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: AISApp.Page.getSuburbsURL,
                data: {
                    text: value
                }
            }
        }
    });

  var dd = $('#InspectorId').data("kendoAutoComplete");
dd.setDataSource(dataSource);

},

これは機能しますが、これが正しい方法なのか、それともキーアップ イベントを使用せずに剣道イベントのみを使用する方法があるのか​​ 疑問に思っていますか?

ありがとう

4

1 に答える 1

1

.cshtml には、Kendo ヘルパーを使用して、URL で DataSource にバインドする方法があります。キーが押されたときに、URL からデータを自動的に再読み取りするように設定できます。基本的に、JavaScript のキーアップ コードをヘルパーのコードに移動します。

コードは次の例のようになります。

<div class="filter-value">
    @(Html.Kendo().AutoComplete()
          .Name("InspectorId")
          .DataTextField("RPersonDetails")
          .Filter("contains")
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("GetProducts", "Home")
                      .Data("onAdditionalData");
              })
              .ServerFiltering(true);
          })
    )
</div>
<script>
    function onAdditionalData() {
        return {
            text: $("#InspectorId").val() 
        };
    }
</script>
于 2013-06-19T13:36:19.303 に答える