Apr 21, 2011, 2:18 PM
[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?
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?
<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]