加载jquery剑道网格基于搜索文本框不在页面加载

我有一个jquery kendo网格在我的应用程序中，我希望如果搜索文本框有值，那么只有它应该加载网格不在页面加载。但我不知道我应该把我的网格放在document.ready函数里面还是在这个函数之外。加载jquery剑道网格基于搜索文本框不在页面加载

下面是我的jQuery网格代码：

$("#grid").kendoGrid({ 
 
      autoBind:false, 
 
      dataSource: { 
 
       transport: { 
 
        read: { 
 
         url: "/Home/GetSearchData", 
 
         type: "POST", 
 
         contentType: "application/json; charset=utf-8", 
 
         dataType: "json", 
 
         data: { searchTerm: firstSearchVal } 
 
        }, 
 
        parameterMap: function (data, operation) { 
 
         return kendo.stringify(data); 
 
        } 
 
       }, 
 
       pageSize: 10, 
 
       schema: { 
 
        data: "data", 
 
        total: "total" 
 
       }, 
 

 
      }, 
 
      dataBound: function() { 
 
       DisplayNoResultFound($("#grid")); 
 
      }, 
 
      serverPaging: true, 
 

 
      pageable: { 
 
       refresh: true, 
 
       pageSizes: true 
 
      }, 
 
      rowTemplate: kendo.template($("#rowTemplate").html()), 
 
     }); 
 
    });

此代码加载数据，如果把人工数据在，并把这个网格的document.ready函数内。但我想在这里它不应该加热document.ready函数只有当文本框将有数据，然后只有kendo网格被调用，并为每个不同的数据，它应该刷新基于数据的网格。

来源

2016-03-15 Vikash

，你可以做以下

$(document).ready(function(){ 
    $('#firstSearchVal').on('change',function(e){ 
     var value = $(this).val(); 
     if(value.length>=3) // search when the user provide at least 3 characters 
     { 
     // only refresh the datasource of the grid by passing the user search text entered. 
     $('#grid').dataSource.read({searchTerm: value}); 
     } 
    }) 
})

希望它会帮助你

来源

2016-03-15 10:38:07 Monah

哇哈迪，感谢的人你救了我的一天。它的工作原理与我预期的一样，我将其标记为答案。 – Vikash

您应该在document.ready中创建网格，但不要包含dataSource（或dataBound-function）。相反，当你想要加载网格时（当有搜索文本时），那么你可以在网格上使用你的搜索结果中的setDataSource函数。
有关setDataSource的信息，请参阅http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-setDataSource。

下面是从上面的链接一个完整的片段：

<div id="grid"></div> 
<script> 
$("#grid").kendoGrid({ 
    columns: [ 
    { field: "name" }, 
    { field: "age" } 
    ], 
    dataSource: [ 
     { name: "Jane Doe", age: 30 } 
    ] 
}); 
var dataSource = new kendo.data.DataSource({ 
    data: [ 
    { name: "John Doe", age: 33 } 
    ] 
}); 
var grid = $("#grid").data("kendoGrid"); 
grid.setDataSource(dataSource); 
</script>

在你的情况，你会创建一个基于搜索文本数据源，然后调用的setDataSource。

来源

2016-03-15 10:18:11

加载jquery剑道网格基于搜索文本框不在页面加载

回答

相关问题