Löschen Sie die Filterung ohne Klicken auf Schaltfläche "Löschen"

Question

Ich habe Kendo-Grid in meiner Anwendung.Und es haben filterable "True" .Wenn wir die Filterung anwenden, dann werden Rasterelemente gefiltert und Rastergröße auch neu sortiert. Wenn wir den Text in der Filterspalte löschen, werden automatisch die Punkte angezeigt, die in der Seitenladung angezeigt werden, ohne die Taste "Clear" zu drücken. Ist das möglich? Mein Netzcode ist

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

Sie benötigen die filter Methode von der Datenquelle des Gitters verwenden:

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

Answer 2

wenn Sie

grid.dataSource.filter({}) 

nennen es besteht die Möglichkeit, dass Sie ganze löschen dataSource-Filter, nicht nur Felder, die im Raster sind. Ich meine, DataSource kann aus irgendeinem Grund vorgefiltert werden.

Ich entwickelte Methode, die nur Filter des Gitters entfernen.

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); 
} 

Und hier ist zweite Methode. Es getrennt ist, da kann es rekursiv rufen werden:

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

Methode kann wie folgt aufgerufen werden:

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

Rekursion gibt es da Datasource Filter aussehen kann:

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

und Verfahren wird rekursiv auf allen verschachtelten 'Filter'-Arrays aufgerufen. Filter oben ist wie:

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

Die Methode ist nicht perfekt und einige getestet ist. Ich hoffe, das hilft jemandem.