Cancellare il filtro senza fare clic sul pulsante di cancellazione

Question

Ho la griglia di kendo nella mia applicazione.E il suo filtro è "vero". Quando applichiamo il filtro, gli elementi della griglia vengono filtrati e le dimensioni della griglia ridimensionate. quando cancelliamo il testo nella colonna del filtro, la griglia visualizza automaticamente gli elementi visualizzati nel caricamento della pagina senza premere il pulsante Cancella. È possibile? Il mio codice di rete è

var grid = $("#grid").kendoGrid({ 
    dataSource: { 
    type : "odata", 
    transport  : { 
     read: "http://demos.kendoui.com/service/Northwind.svc/Orders" 
    }, 
    schema   : { 
     model: { 
     fields: { 
      OrderID : { type: "number" }, 
      Freight : { type: "number" }, 
      ShipName : { type: "string" }, 
      OrderDate: { type: "date" }, 
      ShipCity : { type: "string" } 
     } 
     } 
    }, 
    pageSize  : 10 
    }, 
    filterable: true, 
    sortable : true, 
    pageable : true, 
    columns : [ 
    { 
    field  : "OrderID", 
    filterable: false 
    }, 
    "Freight", 
    { 
    field : "OrderDate", 
    title : "Order Date", 
    width : 100, 
    format: "{0:MM/dd/yyyy}" 
    }, 
    { 
    field: "ShipName", 
    title: "Ship Name", 
    width: 200 
    }, 
    { 
    field: "ShipCity", 
    title: "Ship City" 
    } 
    ] 
}).data("kendoGrid"); 

Answer 1

È necessario utilizzare il metodo filter della sorgente di dati della griglia:

$("#grid").data("kendoGrid").dataSource.filter([]); 

Answer 2

se si chiama

grid.dataSource.filter({}) 

v'è la possibilità, che si cancella tutto filtro DataSource, non solo i campi che sono nella griglia. Voglio dire DataSource può essere prefiltrata per qualche motivo.

Ho sviluppato un metodo che rimuove solo il filtro della griglia.

kendo.ui.Grid.prototype.clearFilters = function(args){ 
    var ignore = []; 
    // test arguments 
    if(typeof args === 'object'){ 
     if(args.hasOwnProperty('ignore')){ 
      if(args.ignore.length > 0){ 
       ignore = args.ignore; 
      } 
     } 
    } 

    // get dataSource of grid and columns of grid 
    var fields = [], filter = this.dataSource.filter(), col = this.columns; 
    if($.isEmptyObject(filter) || $.isEmptyObject(filter)) return; 

    // Create array of Fields to remove from filter and apply ignore fields if exist 
    for(var i = 0, l = col.length; i < l; i++){ 
     if(col[i].hasOwnProperty('field')){ 
      if(ignore.indexOf(col[i].field) === -1){ 
       fields.push(col[i].field) 
      } 
     } 
    } 

    if($.isEmptyObject(fields)) return; 

    // call "private" method 
    var newFilter = this._eraseFiltersField(fields, filter) 

    // set new filter 
    this.dataSource.filter(newFilter); 
} 

E qui è il secondo metodo. È separato perché può essere chiamata ricorsivamente:

kendo.ui.Grid.prototype._eraseFiltersField = function(fields, filter){ 
    for (var i = 0; i < filter.filters.length; i++) { 

     // For combination 'and' and 'or', kendo use nested filters so here is recursion 
     if(filter.filters[i].hasOwnProperty('filters')){ 
      filter.filters[i] = this._eraseFiltersField(fields, filter.filters[i]); 
      if($.isEmptyObject(filter.filters[i])){ 
       filter.filters.splice(i, 1); 
       i--; 
       continue; 
      } 
     } 

     // Remove filters 
     if(filter.filters[i].hasOwnProperty('field')){ 
      if(fields.indexOf(filter.filters[i].field) > -1){ 
       filter.filters.splice(i, 1); 
       i--; 
       continue; 
      } 
     } 
    } 

    if(filter.filters.length === 0){ 
     filter = {}; 
    } 

    return filter; 
} 

metodo può essere chiamato così:

$('#my-grid').data('kendoGrid').clearFilters({ 
    ignore: ['Field1', 'Field2'] 
}) 

ricorsione c'è perché filtro dataSource può assomigliare:

{ 
    logic: "and" 
    filters: [ 
     { 
      logic: "or"  
      filters:[ 
         { 
          field: "Field1" 
          operator: "contains" 
          value: "val1" 
         }, 
         { 
          field: "Field1" 
          operator: "contains" 
          value: "val2" 
         } 
      ], 
     }, 
     { 
      field: "Field3" 
      operator: "contains" 
      value: "val3" 
     } 
    ], 
} 

e metodo è chiamato ricorsivamente su tutti gli array di filtri 'annidati'. filtro alto è come:

("Field3" === "val3" && ("Field1" === "val1" || "Field1" === "val2")) 

Il metodo non è perfetto e pochi testato. Spero che questo aiuti qualcuno.