如何重新过滤道场 DataGrid？答案

【问题标题】：How to refilter a dojo DataGrid?如何重新过滤道场 DataGrid？
【发布时间】：2011-04-08 18:23:52
【问题描述】：

我有一个已经使用 grid.filter(query, rerender) 过滤的 DataGrid。如果我添加另一个项目，在调用 save() 之后，我会在网格中看到新项目，即使它不应该因为过滤器而显示。我在想“好的，我会在商店完成保存后再次过滤它。但是在使用相同的查询调用 grid.filter 后，所有行都消失了。有什么想法我可能做错了吗？

过滤网格的代码：

var filterQuery = dijit.byId("filterTextbox").attr("value");
var grid = dijit.byId("grid");
var queryValue = "*";
if(filterQuery != ""){
    queryValue += filterQuery + "*";
}
grid.filter({name: queryValue}, true);

向网格中添加新项目的代码

function addItemToGrid(newItemName){
     var newItem = {name: newItemName};
     var grid = dijit.byId("grid");
     var store = grid.store;
     store.addItem(newItem);
     store.save();
}

【问题讨论】：

标签： dojo dojox.grid

【解决方案1】：

尝试使用：

store.newItem(newItem);

而不是 store.addItem(newItem); （addItem 不是将商品添加到商店的标准方法）

【讨论】：

【解决方案2】：

在你的 addItemToGrid 函数中，尝试在你的 save 方法中添加一个 onComplete 监听器，并在 onComplete 函数中对网格进行排序或过滤

store.save({onComplete: function() {
         grid.filter({name: queryValue}, true);
    }
});

【讨论】：

【解决方案3】：

我有 same problem 并且只能通过在一些 jQuery 的帮助下定期在后台运行网格过滤器来修复它。这是一些示例代码；希望这可以帮助其他遇到此问题的人。

// ADD JQUERY
<script src="http://code.jquery.com/jquery-latest.js"></script>

// PUT THIS IN THE <HEAD> OF THE PAGE
<script type="text/javascript">
    $(document).ready(function() {
        function filterTheDataGrid() {
            if (dijit.byId("grid") != undefined) {
                dijit.byId("grid").filter({color: "Red"});
            }
        }
    // RUN THE filterTheDataGrid FUNCTION EVERY ONE SECOND (1000 MILLISECONDS) //
    // LOWER '1000' FOR FASTER REFRESHING, MAYBE TO 500 FOR EVERY 0.5 SECOND REFRESHES //
    var refreshDataGrid = setInterval(function() {  filterTheDataGrid();    }, 1000);
    }
</script>

// PUT THIS IN THE <HEAD> OF THE PAGE
<script type="text/javascript">
    // SETUP THE LAYOUT FOR THE DATA //
    var layoutItems = [[
    {
        field: "id",
        name: "ID",
        width: '5px',
        hidden: true
    },
    {
        field: "color",
        name: "Color",
        width: '80px'
    }
]];

// Create an empty datastore //
var storeData = {
    identifier: 'id',
    label: 'id',
    items: []
}
var store3 = new dojo.data.ItemFileWriteStore( {data : storeData} );
</script>

 // PUT THIS IN THE <HTML> OF THE PAGE
<div id="grid" dojoType="dojox.grid.DataGrid" jsId="grid5" store="store3" structure="layoutItems" query="{ type: '*' }" clientSort="true" rowsPerPage="40"></div>

<script type="text/javascript">
function addItemToGrid(formdata) {
    // THIS FUNCTION IS CALLED BY A DIALOG BOX AND GETS FORM DATA PASSED TO IT //
    var jsonobj = eval("(" + dojo.toJson(formData, true) + ")");

    var myNewItem = {
        id: transactionItemID,
        color: jsonobj.color
    };
    // Insert the new item into the store:
    store3.newItem(myNewItem);
    store3.save({onComplete: savecomplete, onError: saveerror});
}
</script>

【讨论】：

我实际上修改了我的代码并创建了一个替代答案，以便过滤器不会每隔 x 毫秒不必要地运行一次，而是仅在将新项目添加到数据网格后运行。 CLICK HERE