Nov 23, 2017, 1:37 PM
[CLOSED] How can I clean the icon and filter for GridFilter ?
Hi Community !
Please check the code sample below:
Step 1. Select TreePanel Element
Step 2. For the Flag's Color column, filter by "white"
Step 3. Select another element of the TreePanel
Expected result:
That all records are displayed.
Trigger icon not shown
Filter field is clean
Obtained result:
All records are displayed.
Trigger icon is being displayed
Filter field maintains value and keep boldface type
[IMAGE]
[/ IMAGE]
I accept suggestions ideas or comments
Note: Most applications maintain the same format and logic.
Thanks in advance!
Please check the code sample below:
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
Ext.Net.Node theNode = new Ext.Net.Node();
theNode.NodeID = "root";
theNode.Expanded = true;
TreePanel1.Root.Add(theNode);
Ext.Net.Node theNodeBlue = new Node();
theNodeBlue.Text = "America";
theNodeBlue.NodeID = "Am";
theNodeBlue.Icon = Icon.Page;
theNodeBlue.Leaf = true;
theNode.Children.Add(theNodeBlue);
Ext.Net.Node theNodeRed = new Node();
theNodeRed.Text = "Europe";
theNodeRed.NodeID = "Eu";
theNodeRed.Icon = Icon.Page;
theNodeRed.Leaf = true;
theNode.Children.Add(theNodeRed);
}
}
[DirectMethod]
public void TreePanel1_ItemClick(string pstrId)
{
try
{
switch (pstrId)
{
case "Am":
this.Store1.DataSource = new object[]
{
new object[] { 1, "Argentina", "LightBlue/White"},
new object[] { 2, " Bolivia", "Yellow/Green/Red"},
new object[] { 3, "Brazil", "Yellow/Green/Blue" },
new object[] { 4, "Chile", "Red/White/Blue"},
new object[]{ 5, "Colombia", "Red/White/Blue"},
};
this.Store1.DataBind();
break;
case "Eu":
this.Store1.DataSource = new object[]
{
new object[] { 1, "Spain", "Yellow/Red"},
new object[] { 2, "France", "Blue/White/Red"},
new object[] { 3, "Italy", "Green/White/Red" },
new object[] { 4, "Germany", "Black/Red/Yellow"},
new object[] { 5, "Greece", "Blue/White" },
};
this.Store1.DataBind();
break;
}
Store1.ClearFilter();
Store1.Filters.Clear();
Store1.Sorters.Clear();
}
catch (Exception)
{
}
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>GridPanel with Local Filtering, Sorting and Paging - Ext.NET Examples</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Viewport ID="ViewPort1" runat="server" Layout="BorderLayout">
<Items>
<ext:FormPanel ID="FormPanel1" runat="server"
MarginSpec="0 0 5 5"
Width="300"
Region="West"
Split="true"
Collapsible="true"
Title="FormPanel1">
<Items>
<ext:TreePanel ID="TreePanel1" runat="server"
MarginSpec="0 0 0 0"
AutoScroll="true"
Frame="true"
Flex="1"
RootVisible="true">
<Listeners>
<ItemClick Handler="App.direct.TreePanel1_ItemClick(record.data.id)"></ItemClick>
</Listeners>
</ext:TreePanel>
</Items>
</ext:FormPanel>
<ext:GridPanel ID="GridPanel1" runat="server"
Title="Country List"
LockText="Bloquear"
UnlockText="Desbloquear"
MarginSpec="0 5 5 0"
SelectionMemory="false"
ForceFit="true"
Region="Center"
Border="False"
Frame="true"
EnableColumnHide="true">
<Store>
<ext:Store ID="Store1" runat="server" PageSize="10">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="Country" />
<ext:ModelField Name="Colour" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Plugins>
<ext:GridFilters ID="GridFilters1" runat="server" />
</Plugins>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" Text="Country" Width="160" DataIndex="Country" Flex="1">
<Filter>
<ext:StringFilter DataIndex="Country" />
</Filter>
</ext:Column>
<ext:Column ID="Column2" runat="server" Text="Flag's Colour" DataIndex="Colour" Flex="1" >
<Filter>
<ext:StringFilter DataIndex="Colour" />
</Filter>
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
</Items>
</ext:Viewport>
</form>
</body>
</html>Step 1. Select TreePanel Element
Step 2. For the Flag's Color column, filter by "white"
Step 3. Select another element of the TreePanel
Expected result:
That all records are displayed.
Trigger icon not shown
Filter field is clean
Obtained result:
All records are displayed.
Trigger icon is being displayed
Filter field maintains value and keep boldface type
[IMAGE]
[/ IMAGE]
I accept suggestions ideas or comments
Note: Most applications maintain the same format and logic.
Thanks in advance!
Last edited by fabricio.murta; Nov 27, 2017 at 5:54 PM.
