фильтр ext.net на сетке - PullRequest
Новая
       13

фильтр ext.net на сетке

0 голосов
/ 09 ноября 2011

у меня есть мой магазин и моя сетка, мне нужно добавить поле фильтра к нему, поэтому добавил тег topbar, который имеет поле поля для фильтрации ... и хочу добавить слушателей на нем, чтобы я мог фильтровать во время записи 2 функции, как показано, это filtergrid () и clearFilter () ... какими должны быть эти 2 функции, зная, что хранилище связано с кодом позади ... 

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

так что мне нужно написать 2 функции, одна из которых фильтрует возвращаемый результат, который будет записан на панели, а другая - очистить и восстановить источник данных снова.

1 Ответ

0 голосов
/ 10 ноября 2011

Вы можете применить фильтр, используя метод filterBy и передав функцию делегата, которая возвращает истину или ложь, основываясь на некоторой логике по вашему выбору, а затем удалить фильтр, используя clearFilter

В терминах режима Кодипримерно так: 

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

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

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