如何通过外部文本框过滤dojo增强的网格

时间:2014-12-30 12:09:36

标签: javascript angularjs dojo

在我的场景中,我维护的网格需要通过文本框中的onchange事件过滤特定列。根据文本更改网格应该过滤。我已经能够使用增强网格提供的过滤功能,并希望在外部进行。

已导入'dojox / grid / EnhancedGrid','dojo / data / ItemFileWriteStore',dojox / grid / enhanced / plugins / Pagination','dojox / grid / enhanced / plugins / Filter',

这是在外部js文件中。 A.js

            grid = new EnhancedGrid({
                store: new ItemFileWriteStore({
                    data: gridObject
                }),

                // "username, firstName, lastName, email, userGroupName, lastLoginValue, phoneNo, organization, status"
                structure: [
                    {
                        name: "User Login Name",
                        field: "username",
                        width: "84px"

                    },
                    {
                        name: "First Name",
                        field: "firstName",
                        width: "84px"

                    },
                    {
                        name: "Last Name",
                        field: "lastName",
                        width: "70px"

                    },
                    {
                        name: "Email",
                        field: "email",
                        width: "70px"
                    }
                ],
                rowSelector: '20px',
                minRowsPerPage: 5,
                rowsPerPage: 5,
                plugins: {
                    pagination: {
                        pageSizes: ["10", "25", "50", "100", "All"],
                        description: true,
                        sizeSwitch: true,
                        pageStepper: true,
                        gotoButton: true,
                        /*page step to be displayed*/
                        maxPageStep: 4,
                        /*position of the pagination bar*/
                        position: "bottom"
                    },
                    filter: {
                        closeFilterbarButton: false,
                        ruleCount: 2
                            //itemsName: "rows"
                    }
                }
            }, "gridee");

            console.log(grid);
            /*append the new grid to the div*/
            grid.placeAt("gridView");
            grid.startup();

---------------功能结束----------------

            UsersCtrl.prototype.filterGrid = function () {
                 var filterText = document.getElementById("txtFilter").value,                        innerDiv = document.getElementById("gridView").firstChild.getAttribute("id");

                 // innerDiv gave the grid id to be filtered.
                 dijit.byId(innerDiv).filter("username", filterText);// Dont no this is correct or not.

            };

----------- html文件-----------------

这里使用了角度和道场。 angular函数也成功调用并能够进入filterGrid函数。

grid === UsersCtrl

   <input type="search" placeholder="Filter by Keywords" data-column="all" data-ng-   model="grid.searchText" data-ng-change="grid.filterGrid()" data-dojo-type="dijit/form/TextBox" id="txtFilter">

   <div id="gridView" style="width:100%; height:300px" align="center" class="claro"></div>

我收到此错误TypeError:object不是函数。请帮助克服这一点。

1 个答案:

答案 0 :(得分:0)

很高兴我在提到这个Set query to search all fields of a dojo datagrid

后得到了一个主意

import dijit / registry

        grid = registry.byId("grid");
        if (filterText) {
            grid.setQuery({"username": filterText + "*"});
        } else {
            grid.setQuery({"username": "*"});
        }

        //dijit.byId("grid").store.fetch(query: {username: filterText});