Question

拥有我的商店和我的网格面板，我需要添加一个过滤器框，所以添加了一个topbar标签，其中包含要过滤的字段框..并且想要在其上添加监听器，所以我会在写作时过滤器，显示的2个函数是filtergrid（）和clearFilter（）......这两个函数应该是什么，知道商店绑定了代码...

<ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="FULLNAME" />
                        <ext:RecordField Name="JOBTITLE" />
                        <ext:RecordField Name="PHONENUMBER1" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>



<ext:Panel ID="Panel1" runat="server" Width="520" Height="300" Collapsible="true" Title="Add Attendies" Collapsed="true">
         <TopBar>
                <ext:Toolbar ID="Toolbar2" runat="server">
                    <Items>
                        <ext:ToolbarTextItem ID="ToolbarTextItem1" runat="server" Text="Filter:" />
                        <ext:ToolbarSpacer />
                        <ext:TriggerField ID="TriggerField1" runat="server" EnableKeyEvents="true">
                            <Triggers>
                                <ext:FieldTrigger Icon="Clear" />
                            </Triggers>
                            <Listeners>
                             **<KeyUp Fn="filtergrid()" Buffer="250" />
                             <TriggerClick Handler="clearFilter();" />**
                            </Listeners>
                        </ext:TriggerField>
                    </Items>
                </ext:Toolbar>
            </TopBar>
            <Items>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <West MarginsSummary="5 5 5 5">
                        <ext:GridPanel 
                            ID="GridPanel1" 
                            runat="server" 
                            StoreID="Store1"
                            DDGroup="GridDDGroup"
                            EnableDragDrop="true"
                            StripeRows="true"
                            AutoExpandColumn="FULLNAME"
                            Width="250"
                            Title="All Contacts">
                            <ColumnModel>
                                <Columns>
                                    <ext:Column Header="Contact Name" ColumnID="FULLNAME"  Width="140" DataIndex="FULLNAME" />
                                    <ext:Column Header="Title"        ColumnID="JOBTITLE" Width="75" DataIndex="JOBTITLE" />
                                    <ext:Column Header="Phone"        ColumnID="PHONENUMBER1" Width="75" DataIndex="PHONENUMBER1" />
                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
                            </SelectionModel>
                            <GetDragDropText Fn="getDragDropText" />
                            <Listeners>
                                <Render Fn="setDD" />
                            </Listeners>
                        </ext:GridPanel>
                    </West>

                    <Center MarginsSummary="5 5 5 0">
                        <ext:GridPanel 
                            ID="GridPanel2" 
                            runat="server" 
                            StoreID="Store2"
                            DDGroup="GridDDGroup"
                            EnableDragDrop="true"
                            StripeRows="true"
                            AutoExpandColumn="FULLNAME"
                            Width="250"
                            Title="Meeting Attendies">
                            <ColumnModel>
                                <Columns>
                                    <ext:Column ColumnID="Contact Name" Header="Contact Name" Width="140" DataIndex="FULLNAME" />
                                    <ext:Column Header="Title" Width="75" DataIndex="JOBTITLE" />
                                    <ext:Column Header="Phone Number" Width="75" DataIndex="PHONENUMBER1" />

                                </Columns>
                            </ColumnModel>
                            <SelectionModel>
                                <ext:RowSelectionModel ID="RowSelectionModel2" runat="server" />
                            </SelectionModel>
                            <GetDragDropText Fn="getDragDropText" />
                            <Listeners>
                                <Render Fn="setDD" />
                            </Listeners>
                        </ext:GridPanel>
                    </Center>
                </ext:BorderLayout>
            </Items>

            <BottomBar>
                <ext:Toolbar ID="Toolbar1" runat="server">
                    <Items>
                        <ext:ToolbarFill ID="ToolbarFill1" runat="server" />
                        <ext:Button ID="Button1" runat="server" Text="Reset both grids">
                            <Listeners>
                                <Click Handler="Store1.loadData(Store1.proxy.data);Store2.removeAll();" />
                            </Listeners>
                        </ext:Button>
                    </Items>
                </ext:Toolbar>
            </BottomBar>
        </ext:Panel>

因此我必须编写两个函数，一个用于过滤返回要在面板中写入的结果，另一个用于再次清除和恢复数据源。

Answer 1

您可以使用filterBy方法应用过滤器并传递委托函数，该函数根据您选择的某些逻辑返回true或false，然后使用clearFilter

删除过滤器

在模式cody术语中，类似这样：

clearFilter() {
    theGridPanel.store.clearFilter(false);
}

filterGrid() {
    theGridPanel.store.filterBy(theFilterFunction)
}

theFilterFunction(record, id) {
    if(record.data.aField === 'yellow') {
        return true;
    }
    return false;
}

网格上的ext.net过滤器

1 个答案: