kendo ui自動完成，如何綁定以加載數據？

Question

我正在使用mvc的kendo 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); 

}, 

這個工作，但只是想知道這是正確的方式做到這一點還是有辦法做到這一點不使用keyup事件，只是用劍道事件？

感謝

Answer 1

在你.cshtml有使用劍道幫手綁定到你的URL數據源的方式。然後，您可以讓它在按下某個鍵時自動重新讀取URL中的數據。 基本上它會將你的javascript keyup代碼移動到幫手的代碼中。

的代碼看起來像這個例子：

<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>