Question

我想问一下是否可以重用远程绑定kendo.data.Datasource而不是使用新参数创建新绑定。

我的方案是我有一个搜索框和一个列表视图。当用户在搜索框中输入时，会向服务器发送带有搜索框值参数的请求。我能够通过创建每个kendo.data.Datasource事件创建新的keyup来使其正常工作，但内存成为我关注的问题。

var viewModel = kendo.observable({
  searchId: "", // searchbox value
  searchResult: null, // search result listview datasource
  searchFnc: function() { // search function
    // QUESTION: is there any way to update the current datasource object 
    // to refresh the list view instead of create new object?
    // something like: 
    // this.set("searchResult.options.transport.read.data.postId", this.get("searchId"));

    this.set("searchResult", new kendo.data.DataSource({
      transport: {
        read: {
          url: "http://jsonplaceholder.typicode.com/comments",
          dataType: "jsonp",
          data: {
            postId: this.get("searchId")
          }
        }
      }
    }));
  }
});

kendo.bind($("#myView"), viewModel);

.item {
  list-style: none;
}
.item span {
  display: inline-block;
  min-width: 40px;
}
#myListView {
  min-height: 50px;
}

<link href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.common.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2016.1.112/styles/kendo.default.min.css" rel="stylesheet" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2016.1.112/js/kendo.all.min.js"></script>



<div id="myView">
  <label>Enter Post ID (1,2,3,4...)
    <label>
      <br/>
      <span class="k-textbox k-space-right">
    <input type="text" data-value-update="keyup" data-bind="value: searchId, events: {keyup: searchFnc}"/>
    <a href="javascript:;" class="k-icon k-i-search" data-bind="click: searchFnc">&nbsp;</a>
  </span>

      <ul id="myListView" data-role="listview" data-bind="source: searchResult" data-template="template-search-result">
      </ul>
</div>

<script type="text/x-kendo-template" id="template-search-result">
  <li class="item">
    <span>#: postId #</span>
    <span>#: id #</span>
    <span>#: name #</span>
  </li>
</script>

Answer 1

这个怎么样？ change-datasource-url-on-grid。它使用的功能与您的功能类似（options.transport.read.url）来自剑道。然后使用.refresh()更新。

Answer 2

我会这样做fiddle

var viewModel = kendo.observable({
    searchId: 1,
    searchResult: new kendo.data.DataSource({
        transport: {
            read: {
                url: function() {
                    return "https://jsonplaceholder.typicode.com/" + viewModel.get("searchId") + "/comments"
                },
                dataType: "jsonp"
            }
         }
    }),
    searchFnc: function() {
        this.searchResult.read();
    }

});

kendo.bind($("#myView"), viewModel);

如何重用kendo ui远程绑定数据源（更改transport.read.data然后刷新）

2 个答案: