2015-09-03 16 views
0

我正在使用dgrid 0.4.0(最新版本)和dstore 1.1.0。現在我有一個像如何過濾多列上的dgrid

myDgrid.set('collection', myStore.filter(new myStore.Filter({includeInUI: true}).or({fruit: /apple|banana|orange/i}, {forceSell: true}))); 

的MyStore我dgrid過濾有20行,其中forceSell是不正確的任何行。果場具有不同的價值,但少數行滿足上述條件。所有行都將'includeInUI'設置爲true。我希望只顯示蘋果或香蕉或橙色的行,但是當我應用上面的過濾器時,所有20行都會顯示出來。

邏輯或不能正常工作嗎?或者我做錯了什麼?另外,當我從web套接字接收數據時,我會將行添加到網格中。 (使用dgrid.put)。

我將不勝感激任何幫助。謝謝!。

回答

1

IncludeInUI已經在我的代碼中設置。所以下面的聲明起作用。

myDgrid.set('collection', myStore.filter(new myStore.Filter().or(new myStore.Filter().eq('fruit','apple'), new myStore.Filter().eq('forceSell', true)))); 

注意:看起來像RegExp在Filter運算符中不被接受。因此,多值情況下可能會

grid.set('collection', store.filter(new store.Filter().or(new store.Filter().in('fruit', ['apple', 'grape']), 
                      new store.Filter().eq('forceSell', true)))); 

完整的代碼是:

<head> 
     <meta charset="utf-8"> 
     <title>Test Simple Grid Creation</title> 
     <meta name="viewport" content="width=570"> 
     <style> 
      @import "dojo/dojo/resources/dojo.css"; 
      @import "dojo/dijit/themes/claro/claro.css"; 
      .heading { 
       font-weight: bold; 
       padding-bottom: 0.25em; 
      } 
      .dgrid { 
       margin: 10px; 
      } 

      /* add styles to size this grid appropriately */ 
      #grid { 
       height: 20em; 
      } 
      #grid .field-order { 
       width: 7%; 
      } 
      #grid .field-name { 
       width: 18%; 
      } 
     </style> 
     <script src="dojo/dojo/dojo.js" 
      data-dojo-config="async: true"></script> 
     <script> 

      var columns = { 
       id: "ID", 
       fruit: "Fruit", 
       includeInUI: "includeInUI", 
       forceSell: "forceSell" 
      }; 

      require(["dgrid/OnDemandGrid", "dstore/Memory", "dojo/domReady!"], function(Grid, Memory){ 
       var data1 = [ 
        {id: 1, fruit:"apple", includeInUI:true, forceSell: false}, 
        {id: 2, fruit:"banana", includeInUI:true, forceSell: false}, 
        {id: 3, fruit:"grape", includeInUI:true, forceSell: false}, 
        {id: 4, fruit:"apple", includeInUI:true, forceSell: false}, 
        {id: 5, fruit:"banana", includeInUI:true, forceSell: false}, 
        {id: 6, fruit:"apple", includeInUI:false, forceSell: false}, 
        {id: 7, fruit:"banana", includeInUI:true, forceSell: false}, 
        {id: 8, fruit:"grape", includeInUI:true, forceSell: false}, 
        {id: 9, fruit:"apple", includeInUI:true, forceSell: false}, 
        {id: 10, fruit:"banana", includeInUI:true, forceSell: false} 
       ]; 
       var store = new Memory({data: data1}); 

       window.grid = new Grid({ 
        columns: columns, 
        collection: store.filter({includeInUI: true}), 
        idProperty: "id", 
        id: "myGrid" 
       }, "grid"); 
      }); 

     </script> 

     <script> 
     function filterData() { 
      require(["dgrid/Grid", "dijit/registry", "dojo/domReady!"], function(Grid, registry){ 
       //var grid = registry.byId('myGrid'); 
       console.log('filterData: ', grid); 
       var store = grid.collection; 
       grid.set('collection', store.filter(new store.Filter().or(new store.Filter().eq('fruit','apple'), new store.Filter().eq('forceSell', true)))); 

      }); 
     } 
     </script> 
    </head> 
    <body class="claro"> 
     <h2>A basic grid rendered from an array</h2> 
     <div id="grid"></div> 
     <div>Buttons to test filter: 
      <button onClick="filterData();">Filter</button> 
     </div> 
    </body> 
</html> 

希望這可以幫助別人。