如何在kendo网格中进行搜索输入?

问题描述 投票:1回答:1

我是一名新的软件开发人员。在我的新公司中,我使用他们的框架来编码。它使用剑道。我试图为Kendo Grid创建一个搜索字段,以便在该网格中找到特定的信息。我试过this method但它不起作用。老实说,我不明白如何使用“运输”的东西。我调用API来获取网格的数据,并在网格的代码行中调用它。

{
    type: 'panel',
    fields: [{
        type: 'panel',
        text: 'Payment List',
        name: 'payment',
        fields: [{
            type: 'grid',
            name: 'paymentGrid',
            data: [],
            toolbar: function(){
                return `<div class="toolbar" style="width:370px">
                            <label class="search-label" for="search-reservation" style="color:white"> Cari berdasarkan No. Pesanan: </label>
                            <input type="search" id="search-reservation" class="search-class">
                        </div>`
                 },
                 sourceOptions: {
                     pageSize: 10
                 },
                 options: {
                     selectable: true,
                     autoheight: true,
                     allowCopy: true,
                     altrows: true,
                     pageable: {
                         refresh: true,
                         buttonCount: 5,
                         pageSizes: [10, 20, 50, 100]
                     },
                     dataBinding: function(){
                         record = (this.dataSource.page() -1) * this.dataSource.pageSize();
                     }
                 },
                 url: function(option){
                      var arg = option.data
                      $.ajax({
                         method: 'POST',
                         url: APILink ,
                         data: JSON.stringify(arg),
                         dataType: 'json',
                         contentType: 'application/json',
                       }).done(function (resp){
                           if(resp.data != null){
                               var nameMap = [];
                               $.each(resp.data,function(key,val){
                                   nameMap.push({
                                       id: val.id,
                                       supplier: val.supplier,
                                       reservation_id: val.reservation_id,
                                       currentPayment: val.state
                                   });
                               });
                               option.success({
                                   data: nameArray,
                                   total: resp.total
                               });
                           }      
                       }).fail(function(jqXHR, status, err){
                           option.error(err);
                       });
                 },
                 fields: [{
                     name: 'number',
                     text: 'No. ',
                         template: "#= ++record #",
                         width: 70,
                     }, {
                         name: 'supplier',
                         text: 'Supplier',
                     }, {
                         name: 'reservation_id',
                         text: 'No. Reservation',
                     }, {
                         name: 'currentPayment',
                         text: 'status',
                     }, {
                         name: 'checked',
                         text: 'choose',
                         width: 100,
                         template: function (item) {
                             return !!item.checked 
                                  ? `<input id="${item.id}" name='ceklis-boks[]' class="check" checked value="${item.id}" type=\'checkbox\' />`
                                  : `<input id="${item.id}" name='ceklis-boks[]' class="check" value="${item.id}" type=\'checkbox\' />`
                            }
                        }],
                        onDataBound: 'dataBound',
                    }]
  }

然后我使用了与in previous link之前提到的相同的代码,并将该代码中的ID(#)替换为我的代码。但是,它不会起作用。我来到his fiddle,我认为这是因为他的PlainDs变量和$(“#category”)。kendoAutoComplete({...})或serverPaging,serverSorting或serverFiltering。所以,我评论所有here并仍然正常工作。所以基本上,我可以像Qazxswpoi一样编写第49-81行的代码。但为什么它不起作用?为了您的信息,我使用其名称调用网格,或者有时我给它一个类。但它不会起作用。如果我使用类或名称而不是ID,这是一个问题吗?

javascript jquery search kendo-ui kendo-grid
1个回答
0
投票

“不工作”一词在这里过于宽泛,如果你能更具体地说明哪些不起作用,我们就可以更好地指出。但是我假设你知道如何让网格显示等等。所以基本上让搜索工作我通常在我的“搜索”按钮的点击事件中有这个:

in his post
© www.soinside.com 2019 - 2024. All rights reserved.