[CLOSED] GridPanel Multi column filter

  1. #1

    [CLOSED] GridPanel Multi column filter

    Hi,

    I have grid control and I added multi column filter. As you can see below picture, when I want to select a date from date control, length of it is small. How can I fix it?

    Click image for larger version. 

Name:	1.jpg 
Views:	285 
Size:	90.0 KB 
ID:	2615


                                                            <ext:GridPanel ID="GridPanel_CustomerForms" runat="server" StoreID="Store_CustomerForms"
                                                                AutoExpandColumn="IndividualFullName" TrackMouseOver="true" StripeRows="true"
                                                                Header="false" Border="false">
                                                                <TopBar>
                                                                    <ext:Toolbar ID="Toolbar_TopBar" runat="server" Hidden="true">
                                                                        <Items>
                                                                            <ext:ToolbarFill ID="ToolbarFill1" runat="server" />
                                                                            <ext:Button ID="Button_AddNewForm" runat="server" Text="Add New Form" Icon="Add">
                                                                                <Listeners>
                                                                                    <Click Handler="Button_AddNewForm_Click();" />
                                                                                </Listeners>
                                                                            </ext:Button>
                                                                        </Items>
                                                                    </ext:Toolbar>
                                                                </TopBar>
                                                                <ColumnModel ID="ColumnModel1" runat="server">
                                                                    <Columns>
                                                                        <ext:RowNumbererColumn />
                                                                        <ext:Column Header="Task ID" DataIndex="TaskID" Width="50">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Task Type" DataIndex="TaskType" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Network Type" DataIndex="SecondaryType" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Last Status" DataIndex="LastStatus" Width="200">
                                                                        </ext:Column>
                                                                        <ext:Column Header="First Name" DataIndex="FirstName" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Last Name" DataIndex="LastName" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo1" DataIndex="PhoneNo1" Width="150" Hidden="false">
                                                                        </ext:Column>
                                                                        <ext:DateColumn Header="Insert Date" DataIndex="InsertDate" Width="150" Format="dd-MM-yyyy HH:mm:ss"
                                                                            Hidden="false">
                                                                        </ext:DateColumn>
                                                                        <ext:Column Header="Customer Type" DataIndex="CustomerType" Width="100">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Registration Person Type" DataIndex="RegistrationPersonType"
                                                                            Width="120">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Registration Full Name" DataIndex="RegistrationFullName" Width="150">
                                                                        </ext:Column>
                                                                        <ext:DateColumn Header="Registration Date" DataIndex="RegistrationDate" Width="150"
                                                                            Format="dd-MM-yyyy HH:mm:ss">
                                                                        </ext:DateColumn>
                                                                        <ext:Column ColumnID="IndividualFullName" Header="Full Name">
                                                                            <Renderer Handler="var fullName = ''; if(record.data['CustomerType']=='IndividualPerson'){fullName = '<b>' + record.data['LastName'] + '</b>,' + record.data['FirstName']}else{fullName = record.data['PublicFullName']} return fullName" />
                                                                        </ext:Column>
                                                                        <ext:Column Header="Father Name" DataIndex="FatherName" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Mother Name" DataIndex="MotherName" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Mother Last Name" DataIndex="MotherLastName" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:DateColumn Header="Birth Date" DataIndex="BirthDate" Width="150" Format="dd-MM-yyyy HH:mm:ss"
                                                                            Hidden="true">
                                                                        </ext:DateColumn>
                                                                        <ext:Column Header="Sex" DataIndex="Sex" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Country" DataIndex="Country" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="BirthPlace" DataIndex="BirthPlace" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Citizenship" DataIndex="Citizenship" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Individual Address" DataIndex="IndividualAddress" Width="150">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Contact No" DataIndex="ContactNo" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Email" DataIndex="Email" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Public Full Name" DataIndex="PublicFullName" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Public NIPT" DataIndex="PublicNIPT" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Public Address" DataIndex="PublicAddress" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Document Type" DataIndex="DocumentType" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Passport Type" DataIndex="PassportType" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="Identity Number" DataIndex="IdentityNumber" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:DateColumn Header="Identity Date" DataIndex="IdentityDate" Width="150" Format="dd-MM-yyyy HH:mm:ss"
                                                                            Hidden="true">
                                                                        </ext:DateColumn>
                                                                        <ext:Column Header="Certificate Type" DataIndex="CertificateType" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo2" DataIndex="PhoneNo2" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo3" DataIndex="PhoneNo3" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo4" DataIndex="PhoneNo4" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo5" DataIndex="PhoneNo5" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="PhoneNo6" DataIndex="PhoneNo6" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:Column Header="UserID" DataIndex="UserID" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                        <ext:DateColumn Header="Update Date" DataIndex="UpdateDate" Width="150" Format="dd-MM-yyyy HH:mm:ss"
                                                                            Hidden="true">
                                                                        </ext:DateColumn>
                                                                        <ext:Column Header="Is Deleted" DataIndex="IsDeleted" Width="150" Hidden="true">
                                                                        </ext:Column>
                                                                    </Columns>
                                                                </ColumnModel>
                                                                <View>
                                                                    <ext:GridView runat="server">
                                                                        <HeaderRows>
                                                                            <ext:HeaderRow>
                                                                                <Columns>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:Button ID="Button_CustomerFormsClearFilter" runat="server" Icon="Cancel">
                                                                                                <Listeners>
                                                                                                    <Click Handler="Button_CustomerFormsClearFilter_Click();" />
                                                                                                </Listeners>
                                                                                            </ext:Button>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:NumberField ID="NumberField_TaskIDFilter" runat="server" MaxLength="3" EnableKeyEvents="true">
                                                                                                <Listeners>
                                                                                                    <KeyUp Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" Buffer="250" />
                                                                                                </Listeners>
                                                                                            </ext:NumberField>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:ComboBox ID="ComboBox_TaskTypeFilter" runat="server" Editable="false" SelectedIndex="0">
                                                                                                <Items>
                                                                                                    <ext:ListItem Text="All" Value="" />
                                                                                                </Items>
                                                                                                <Listeners>
                                                                                                    <Select Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" />
                                                                                                </Listeners>
                                                                                            </ext:ComboBox>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:ComboBox ID="ComboBox_SecondaryTypeFilter" runat="server" Editable="false" SelectedIndex="0">
                                                                                                <Items>
                                                                                                    <ext:ListItem Text="All" Value="" />
                                                                                                </Items>
                                                                                                <Listeners>
                                                                                                    <Select Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" />
                                                                                                </Listeners>
                                                                                            </ext:ComboBox>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:ComboBox ID="ComboBox_LastStatusFilter" runat="server" TriggerAction="All" Mode="Local"
                                                                                                DisplayField="LastStatusText" ValueField="LastStatusValue" Editable="false">
                                                                                                <Store>
                                                                                                    <ext:Store ID="Store1" runat="server">
                                                                                                        <Reader>
                                                                                                            <ext:ArrayReader>
                                                                                                                <Fields>
                                                                                                                    <ext:RecordField Name="LastStatusText" />
                                                                                                                    <ext:RecordField Name="LastStatusValue" />
                                                                                                                </Fields>
                                                                                                            </ext:ArrayReader>
                                                                                                        </Reader>
                                                                                                    </ext:Store>
                                                                                                </Store>
                                                                                                <Listeners>
                                                                                                    <Select Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" />
                                                                                                </Listeners>
                                                                                            </ext:ComboBox>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:TextField ID="TextField_FirstNameFilter" runat="server" EnableKeyEvents="true">
                                                                                                <Listeners>
                                                                                                    <KeyUp Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" Buffer="250" />
                                                                                                </Listeners>
                                                                                            </ext:TextField>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:TextField ID="TextField_LastNameFilter" runat="server" EnableKeyEvents="true">
                                                                                                <Listeners>
                                                                                                    <KeyUp Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" Buffer="250" />
                                                                                                </Listeners>
                                                                                            </ext:TextField>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:TextField ID="TextField_PhoneNo1Filter" runat="server" EnableKeyEvents="true">
                                                                                                <Listeners>
                                                                                                    <KeyUp Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" Buffer="250" />
                                                                                                </Listeners>
                                                                                            </ext:TextField>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                    <ext:HeaderColumn>
                                                                                        <Component>
                                                                                            <ext:CompositeField ID="CompositeField1" runat="server">
                                                                                                <Items>
                                                                                                    <ext:DateField ID="DateField_InsertDateFilter" runat="server" Flex="1">
                                                                                                        <Listeners>
                                                                                                            <Select Handler="applyFilterRefresh(#{GridPanel_CustomerForms}.id);" />
                                                                                                        </Listeners>
                                                                                                    </ext:DateField>
                                                                                                    <ext:Button ID="Button_ClearInsertDateFilter" runat="server" Icon="Cancel">
                                                                                                        <Listeners>
                                                                                                            <Click Handler="Button_ClearInsertDateFilter_Click();" />
                                                                                                        </Listeners>
                                                                                                    </ext:Button>
                                                                                                </Items>
                                                                                            </ext:CompositeField>
                                                                                        </Component>
                                                                                    </ext:HeaderColumn>
                                                                                </Columns>
                                                                            </ext:HeaderRow>
                                                                        </HeaderRows>
                                                                    </ext:GridView>
                                                                </View>
                                                                <SelectionModel>
                                                                    <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true">
                                                                        <DirectEvents>
                                                                            <RowSelect OnEvent="GridPanel_CustomerForms_RowSelect" Buffer="100">
                                                                                <EventMask ShowMask="true" Msg="Processing..." Target="CustomTarget" CustomTarget="={#{Panel3}.body}" />
                                                                                <ExtraParams>
                                                                                    <%-- or can use params[2].id as value --%>
                                                                                    <ext:Parameter Name="TaskID" Value="this.getSelected().id" Mode="Raw" />
                                                                                </ExtraParams>
                                                                            </RowSelect>
                                                                        </DirectEvents>
                                                                    </ext:RowSelectionModel>
                                                                </SelectionModel>
                                                                <LoadMask ShowMask="true" />
                                                                <SaveMask ShowMask="true" />
                                                                <BottomBar>
                                                                    <ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="10" DisplayInfo="true"
                                                                        DisplayMsg="Displaying customer forms {0} - {1} of {2}" EmptyMsg="No customer form to display">
                                                                        <Items>
                                                                            <ext:Label ID="Label1" runat="server" Text="Page size:" />
                                                                            <ext:ToolbarSpacer ID="ToolbarSpacer1" runat="server" Width="10" />
                                                                            <ext:ComboBox ID="ComboBox1" runat="server" Width="80">
                                                                                <Items>
                                                                                    <ext:ListItem Text="1" />
                                                                                    <ext:ListItem Text="2" />
                                                                                    <ext:ListItem Text="5" />
                                                                                    <ext:ListItem Text="10" />
                                                                                    <ext:ListItem Text="20" />
                                                                                </Items>
                                                                                <SelectedItem Value="10" />
                                                                                <Listeners>
                                                                                    <Select Handler="#{PagingToolbar1}.pageSize = parseInt(this.getValue()); #{PagingToolbar1}.doLoad();" />
                                                                                </Listeners>
                                                                            </ext:ComboBox>
                                                                        </Items>
                                                                    </ext:PagingToolbar>
                                                                </BottomBar>
                                                                <Listeners>
                                                                    <DblClick Fn="GridPanel_CustomerForms_DblClick" />
                                                                    <CellClick Fn="cellClick" />
                                                                </Listeners>
                                                            </ext:GridPanel>
    Last edited by Daniil; May 02, 2011 at 10:24 AM. Reason: [CLOSED]
  2. #2
    Hi,

    Are you using IE9? If yes then please update from SVN and retest

Similar Threads

  1. Replies: 2
    Last Post: May 01, 2012, 4:57 PM
  2. [CLOSED] Gridpanel Filter and Recalculate Column Totals
    By IanPearce in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 22, 2012, 3:08 PM
  3. Replies: 8
    Last Post: Sep 13, 2011, 8:47 PM
  4. Replies: 3
    Last Post: Aug 13, 2010, 4:25 PM
  5. [CLOSED] [1.0] gridpanel multi header + column move
    By brettmas in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 28, 2010, 5:20 AM

Posting Permissions