0

I am using dgrid 0.4.0 (latest) and dstore 1.1.0. Now I have a filtering on my dgrid like 

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

myStore has 20 rows in which forceSell is not true for any row. fruit field has different values in it but few rows meet the above condition. All of the rows have 'includeInUI' set to true. I expect only the rows that are apple or banana or orange should be displayed but when I apply above filter all 20 rows get displayed.

Is the logical OR is not functioning? Or Am I doing something wrong? Also I add rows to the grid when I receive data from web socket. (using dgrid.put).

I would appreciate any help. Thanks!.

1 Answer 1

Reset to default
1

IncludeInUI was already set in my code. So the following statement works.

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

Note: looks like RegExp is not accepted in Filter operators. So the multiple values case may go 

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

complete code is:

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

Hope this helps someone.

Not the answer you're looking for? Browse other questions tagged or ask your own question.