PDA

View Full Version : [CLOSED] remote filter dose not be triggered?



hdsoso
Jan 15, 2014, 12:15 PM
how to trigger filter event when typing some characters in filter header input text box?


<ext:Viewport runat="server" Layout="FitLayout">
<Items>
<ext:GridPanel runat="server" Title="文章管理">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button runat="server" Text="新增" Icon="ApplicationFormAdd">
<DirectEvents>
<Click OnEvent="ShowAddWindow"></Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Store>
<ext:Store runat="server" ID="store1" OnReadData="LoadArticles" RemoteFilter="True" PageSize="50">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="id"></ext:ModelField>
<ext:ModelField Name="title"></ext:ModelField>
<ext:ModelField Name="uid"></ext:ModelField>
<ext:ModelField Name="QizUser" Type="Object"></ext:ModelField>
<ext:ModelField Name="colid"></ext:ModelField>
<ext:ModelField Name="QizColumn" Type="Object"></ext:ModelField>
<ext:ModelField Name="addtime" Type="Date"></ext:ModelField>
<ext:ModelField Name="cont"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy></ext:PageProxy>
</Proxy>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" DataIndex="id" Text="编号11">
</ext:Column>

<ext:Column runat="server" DataIndex="title" Text="标题" Flex="1">
<Renderer Fn="renderArt"></Renderer>
</ext:Column>
<ext:Column runat="server" DataIndex="colid" Text="栏目">
<Renderer Fn="renderColumn"></Renderer>

</ext:Column>
<ext:Column runat="server" DataIndex="uid" Text="作者">
<Renderer Fn="renderUser"></Renderer>
</ext:Column>
<ext:DateColumn runat="server" DataIndex="addtime" Text="发表时间" Format="yyyy-MM-dd"></ext:DateColumn>
<ext:CommandColumn runat="server" Text="操作">
<Commands>

<ext:GridCommand Icon="NoteEdit" CommandName="Edit">
<ToolTip Text="修改"></ToolTip>
</ext:GridCommand>
<ext:GridCommand Icon="Delete" CommandName="Delete">
<ToolTip Text="删除"></ToolTip>
</ext:GridCommand>
</Commands>
<Listeners>
<Command Fn="operArt" />
</Listeners>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<Plugins>
<ext:RowExpander runat="server">
<Template ID="Template1" runat="server">
<Html>
<div style="background: #fff;">{cont}</div>
</Html>
</Template>
</ext:RowExpander>

</Plugins>
<BottomBar>
<ext:PagingToolbar runat="server" StoreID="store1"></ext:PagingToolbar>
</BottomBar>
<Plugins>
<ext:FilterHeader ID="FilterHeader1" runat="server" Remote="true" />
</Plugins>
<SelectionModel>
<ext:RowSelectionModel runat="server" Mode="Multi" ID="CellSelectionModel1"></ext:RowSelectionModel>
</SelectionModel>
</ext:GridPanel>
</Items>
</ext:Viewport>




protected void LoadArticles(object sender, StoreReadDataEventArgs e)
{
FilterHeaderConditions fhc = new FilterHeaderConditions(e.Parameters["filterheader"]);
foreach (FilterHeaderCondition condition in fhc.Conditions)
{
string dataIndex = condition.DataIndex;
FilterType type = condition.Type;
string op = condition.Operator;
object value = null;

switch (condition.Type)
{
case FilterType.Boolean:
value = condition.Value<bool>();
break;

case FilterType.Date:
switch (condition.Operator)
{
case "=":
value = condition.Value<DateTime>();
break;

case "compare":
value = FilterHeaderComparator<DateTime>.Parse(condition.JsonValue);
break;
}
break;

case FilterType.Numeric:
switch (condition.Operator)
{
case "=":
value = condition.Value<int>();
break;
case "compare":
value = FilterHeaderComparator<int>.Parse(condition.JsonValue);
break;
}
break;
case FilterType.String:
value = condition.Value<string>();
break;
default:
throw new ArgumentOutOfRangeException();
}

}
int start = e.Start;
int limt = e.Limit;
var total = 0;
var ll = artService.PageArts(start, limt, out total);
// var ll = artService.PageArts1(start, limt, out total);
e.Total = total;
store1.DataSource = ll;
store1.DataBind();
}

the LoadArticles execute when page is load , but when i type some characters on the filter's input text, the function dose not execute,what i miss sth.?

Daniil
Jan 15, 2014, 1:01 PM
Hi @hdsoso,

It appears to be working here.
http://examples2.ext.net/#/GridPanel/FilterHeader/Remote/


how to trigger filter event when typing some characters in filter header input text box?

For any column or specific one?

hdsoso
Jan 15, 2014, 1:29 PM
Hi @hdsoso,

It appears to be working here.
http://examples2.ext.net/#/GridPanel/FilterHeader/Remote/



For any column or specific one?
is there some thing different for all of the column or one coloumn?

i know the example above, but i do not know what i miss sth.?

Daniil
Jan 15, 2014, 3:14 PM
is there some thing different for all of the column or one coloumn?

Well, type for example, in the "Date" column. Filtration triggers on Enter only. Type in the "Visible" column, filtration occurs only for "true", "false", "0", "1".

So, it depends on a type of filter.

You can set up your own filter field in a Column's HeaderItems.

hdsoso
Jan 15, 2014, 3:54 PM
Well, type for example, in the "Date" column. Filtration triggers on Enter only. Type in the "Visible" column, filtration occurs only for "true", "false", "0", "1".

So, it depends on a type of filter.

You can set up your own filter field in a Column's HeaderItems.

Filtration triggers on Enter only????

i wrote a demo, why not execute when type some thing on the filter text of "name"


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm17.aspx.cs" Inherits="extdemo.test.WebForm17" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script runat="server">
public class Student
{
public int id { get; set; }
public string name { get; set; }
}
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
}
}
public void loadit(object sender, StoreReadDataEventArgs e)
{
FilterHeaderConditions fhc = new FilterHeaderConditions(e.Parameters["filterheader"]);

foreach (FilterHeaderCondition condition in fhc.Conditions)
{
string dataIndex = condition.DataIndex;
FilterType type = condition.Type;
string op = condition.Operator;
object value = null;

switch (condition.Type)
{
case FilterType.Boolean:
value = condition.Value<bool>();
break;

case FilterType.Date:
switch (condition.Operator)
{
case "=":
value = condition.Value<DateTime>();
break;

case "compare":
value = FilterHeaderComparator<DateTime>.Parse(condition.JsonValue);
break;
}
break;
case FilterType.String:
value = condition.Value<string>();
break;
default:
throw new ArgumentOutOfRangeException();
}
}
s_store.DataSource = new List<Student>
{
new Student{id=1,name="s1"},
new Student{id=2,name="s2"},
new Student{id=3,name="s3"},
new Student{id=4,name="s4"},
new Student{id=5,name="s5"},
new Student{id=6,name="s6"}
};
s_store.DataBind();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager runat="server" SourceFormatting="True" RenderScripts="CDN" RenderStyles="CDN"></ext:ResourceManager>
<ext:GridPanel runat="server">
<Store>
<ext:Store runat="server" ID="s_store" OnReadData="loadit" RemoteFilter="True">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="id"></ext:ModelField>
<ext:ModelField Name="name"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy></ext:PageProxy>
</Proxy>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" DataIndex="id" Text="id"></ext:Column>
<ext:Column runat="server" DataIndex="name" Text="name"></ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:FilterHeader ID="FilterHeader1" runat="server" Remote="true" />
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>

hdsoso
Jan 15, 2014, 3:56 PM
Well, type for example, in the "Date" column. Filtration triggers on Enter only. Type in the "Visible" column, filtration occurs only for "true", "false", "0", "1".

So, it depends on a type of filter.

You can set up your own filter field in a Column's HeaderItems.
can you describe it?
you mean for dataindex's type is string , must type string ?
dataindex's type is Date, must type data format string?
what's "Visible" column?

Daniil
Jan 16, 2014, 3:43 AM
can you describe it?
you mean for dataindex's type is string , must type string ?
dataindex's type is Date, must type data format string?

I mean that a type of filter depends on a ModelField's Type.



what's "Visible" column?

The last column here:
http://examples2.ext.net/#/GridPanel/FilterHeader/Remote/

tobros
Jan 16, 2014, 3:46 AM
I mean that a type of filter depends on a ModelField's Type.



The last column here:
http://examples2.ext.net/#/GridPanel/FilterHeader/Remote/

I wrote a demo above , why handler not execute when i type something in filter input?

Daniil
Jan 16, 2014, 3:52 AM
Filtration triggers on Enter only????

For the date type filter.


i wrote a demo, why not execute when type some thing on the filter text of "name"

It executes, but you return all the data regardless the filtering conditions.

hdsoso
Jan 16, 2014, 5:20 AM
For the date type filter.



It executes, but you return all the data regardless the filtering conditions.

what you type before the handler execute? why not execute in my front.

i test my code again,error
7492


<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm11.aspx.cs" Inherits="TobrosCWT.test.WebForm11" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script runat="server">
public class Student
{
public int id { get; set; }
public string name { get; set; }
}
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
}
}
public void loadit(object sender, StoreReadDataEventArgs e)
{
FilterHeaderConditions fhc = new FilterHeaderConditions(e.Parameters["filterheader"]);

foreach (FilterHeaderCondition condition in fhc.Conditions)
{
string dataIndex = condition.DataIndex;
FilterType type = condition.Type;
string op = condition.Operator;
object value = null;

switch (condition.Type)
{
case FilterType.Boolean:
value = condition.Value<bool>();
break;

case FilterType.Date:
switch (condition.Operator)
{
case "=":
value = condition.Value<DateTime>();
break;

case "compare":
value = FilterHeaderComparator<DateTime>.Parse(condition.JsonValue);
break;
}
break;
case FilterType.String:
value = condition.Value<string>();
break;
default:
throw new ArgumentOutOfRangeException();
}
}
s_store.DataSource = new List<Student>
{
new Student{id=1,name="s1"},
new Student{id=2,name="s2"},
new Student{id=3,name="s3"},
new Student{id=4,name="s4"},
new Student{id=5,name="s5"},
new Student{id=6,name="s6"}
};
s_store.DataBind();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" SourceFormatting="True" RenderScripts="CDN" RenderStyles="CDN"></ext:ResourceManager>
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store runat="server" ID="s_store" OnReadData="loadit" RemoteFilter="True">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="id"></ext:ModelField>
<ext:ModelField Name="name"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy></ext:PageProxy>
</Proxy>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column ID="Column1" runat="server" DataIndex="id" Text="id"></ext:Column>
<ext:Column ID="Column2" runat="server" DataIndex="name" Text="name"></ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:FilterHeader ID="FilterHeader1" runat="server" Remote="true" />
</Plugins>
</ext:GridPanel>
</form>
</body>
</html>

Daniil
Jan 16, 2014, 5:29 AM
Seems I hear about the error the first time.

Well, if a request failure occurs, it means that there is a request to server. But, probably, something wrong happens on server side.

Please post a response text of that failure request.

hdsoso
Jan 16, 2014, 5:36 AM
Seems I hear about the error the first time.

Well, if a request failure occurs, it means that there is a request to server. But, probably, something wrong happens on server side.

Please post a response text of that failure request.

responsed by google chrome.


<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<link type="text/css" rel="stylesheet" href="http://speed.ext.net/ext.net/2.3.1/extjs/resources/ext-theme-neptune/ext-theme-neptune-all.css" id="ext-theme" />
<link type="text/css" rel="stylesheet" href="http://speed.ext.net/ext.net/2.3.1/extnet/resources/css/extnet-all.css" id="extnet-styles" />
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/extjs/ext-all.js"></script>
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/extjs/ext-theme-neptune.js"></script>
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/extnet/extnet-all.js"></script>
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/extnet/locale/ext-lang-zh-CN.js"></script>
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/ux/clearbutton/clearbutton.js"></script>
<script type="text/javascript" src="http://speed.ext.net/ext.net/2.3.1/ux/filterheader/filterheader.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>

</title>
<script type="text/javascript">
//<![CDATA[
Ext.net.ResourceMgr.init({
"id": "ResourceManager1",
"cdnPath": "http://speed.ext.net/ext.net/2.3.1",
"aspForm": "form1",
"theme": "neptune"
});Ext.onReady(function(){Ext.create("Ext.grid.Panel",{
"store": {
"model": Ext.define("App.Model1", {extend: "Ext.data.Model",
"fields": [{
"name": "id"
},{
"name": "name"
}]
}),
"storeId": "s_store",
"autoLoad": true,
"proxy": {
"type": "page"
},
"remoteFilter": true
},
"id": "GridPanel1",
"plugins": [
{
"proxyId": "FilterHeader1",
"ptype": "filterheader",
"remote": true
}
],
"renderTo": "App.GridPanel1_Container",
"columns": {
"items": [
{
"id": "Column1",
"headerItems": [
{
"plugins": [
{
"ptype": "clearbutton"
}
],
"xtype": "textfield"
}
],
"dataIndex": "id",
"text": "id"
},
{
"id": "Column2",
"headerItems": [
{
"plugins": [
{
"ptype": "clearbutton"
}
],
"xtype": "textfield"
}
],
"dataIndex": "name",
"text": "name"
}
]
}
});});
//]]>
</script>
</head>
<body>
<form method="post" action="WebForm11.aspx" id="form1">
<div class="aspNetHidden">



</div>





<div id="App.GridPanel1_Container"></div>
</form>
</body>
</html>

hdsoso
Jan 16, 2014, 5:41 AM
i remove the cdn , it works well now. maybe it is a bug , please resolve it.


<ext:ResourceManager ID="ResourceManager1" runat="server" SourceFormatting="True" ></ext:ResourceManager>

Daniil
Jan 16, 2014, 5:42 AM
Sorry, it doesn't look a response of a Load request. It looks the Page sources...

Daniil
Jan 16, 2014, 5:59 AM
Please clarify are you using the Ext.NET from the SVN trunk?

hdsoso
Jan 16, 2014, 6:20 AM
Please clarify are you using the Ext.NET from the SVN trunk?
yes, ext.net version 2.3.1.30798
the bug show when using cdn in this version

Daniil
Jan 16, 2014, 1:04 PM
I guess the bug was fixed in v2.4.

To avoid it, please try:

<ext:ModelField Name="id" Type="Int" />
<ext:ModelField Name="name" Type="String" />

hdsoso
Jan 17, 2014, 1:55 PM
hello, team.
why the handler only execute on some of the column, it dose not be triggered on the columns of "栏目" and "作者" , please see the video if you do not know what i mean
http://screencast.com/t/QFAybIobRl
please see my code


<Store>
<ext:Store runat="server" ID="store1" OnReadData="LoadArticles" PageSize="50">
<Model>
<ext:Model runat="server" IDProperty="id">
<Fields>
<ext:ModelField Name="id" Type="Int"></ext:ModelField>
<ext:ModelField Name="title" Type="String"></ext:ModelField>
<ext:ModelField Name="uid"></ext:ModelField>
<ext:ModelField Name="QizUser" Type="Object"></ext:ModelField>
<ext:ModelField Name="colid"></ext:ModelField>
<ext:ModelField Name="QizColumn" Type="Object"></ext:ModelField>
<ext:ModelField Name="addtime" Type="Date"></ext:ModelField>
<ext:ModelField Name="cont"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy></ext:PageProxy>
</Proxy>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column runat="server" DataIndex="id" Text="编号">
</ext:Column>

<ext:Column runat="server" DataIndex="title" Text="标题" Flex="1">
<Renderer Fn="renderArt"></Renderer>
</ext:Column>
<ext:Column runat="server" DataIndex="colid" Text="栏目">
<Renderer Fn="renderColumn"></Renderer>

</ext:Column>
<ext:Column runat="server" DataIndex="uid" Text="作者">
<Renderer Fn="renderUser"></Renderer>
</ext:Column>
<ext:DateColumn runat="server" DataIndex="addtime" Text="发表时间" Format="yyyy-MM-dd"></ext:DateColumn>
<ext:CommandColumn runat="server" Text="操作">
<Commands>

<ext:GridCommand Icon="NoteEdit" CommandName="Edit">
<ToolTip Text="修改"></ToolTip>
</ext:GridCommand>
<ext:GridCommand Icon="Delete" CommandName="Delete">
<ToolTip Text="删除"></ToolTip>
</ext:GridCommand>
</Commands>
<Listeners>
<Command Fn="operArt" />
</Listeners>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<Plugins>
<ext:RowExpander runat="server">
<Template ID="Template1" runat="server">
<Html>
<div style="background: #fff;">{cont}</div>
</Html>
</Template>
</ext:RowExpander>

</Plugins>
<BottomBar>
<ext:PagingToolbar runat="server" StoreID="store1"></ext:PagingToolbar>
</BottomBar>
<Plugins>
<ext:FilterHeader ID="FilterHeader1" runat="server" Remote="true" />
</Plugins>



protected void LoadArticles(object sender, StoreReadDataEventArgs e)
{
FilterHeaderConditions fhc = new FilterHeaderConditions(e.Parameters["filterheader"]);
string dataIndex = string.Empty;
object value = null;
foreach (FilterHeaderCondition condition in fhc.Conditions)
{
dataIndex = condition.DataIndex;
FilterType type = condition.Type;
string op = condition.Operator;
value = null;

switch (condition.Type)
{
case FilterType.Boolean:
value = condition.Value<bool>();
break;

case FilterType.Date:
value = condition.Value<DateTime>();
break;

case FilterType.Numeric:
value = condition.Value<int>();
break;

case FilterType.String:
value = condition.Value<string>();
break;
default:
throw new ArgumentOutOfRangeException();
}

}

int start = e.Start;
int limt = e.Limit;
var total = 0;
var ll = artService.PageArts(start, limt, out total, dataIndex, value);
// var ll = artService.PageArts1(start, limt, out total);
e.Total = total;
store1.DataSource = ll;
store1.DataBind();
}



public List<QizArticle> PageArts(int start, int limit, out int total, string dataindex, object value)
{
List<QizArticle> ll = new List<QizArticle>();
if (dataindex == "title")
{
string val = value.ToString();
total = _ent.QizArticles.Count(v => v.title.Contains(val));
ll = _ent.QizArticles.Where(v => v.title.Contains(val)).ToList();
}
else if (dataindex == "id")
{
int val = (int)value;
total = _ent.QizArticles.Count(v => v.id == val);
ll = _ent.QizArticles.Where(v => v.id == val).ToList();
}
else if (dataindex == "colid")
{
string val = value.ToString();
total = _ent.QizArticles.Count(v => v.QizColumn.colname.Contains(val));
ll = _ent.QizArticles.Where(v => v.QizColumn.colname.Contains(val)).ToList();
}
else if (dataindex == "uid")
{
string val = value.ToString();
total = _ent.QizArticles.Count(v => v.QizUser.uname.Contains(val));
ll = _ent.QizArticles.Where(v => v.QizUser.uname.Contains(val)).ToList();
}
else if (dataindex == "addtime")
{
DateTime val = DateTime.Parse(value.ToString());
total = _ent.QizArticles.Count(v => v.addtime == val);
ll = _ent.QizArticles.Where(v => v.addtime == val).ToList();
}
else
{
ll = _ent.QizArticles.OrderByDescending(o => o.id)
.Skip(start)
.Take(limit).ToList();
total = _ent.QizArticles.Count();
}
return ll;
}

Daniil
Jan 17, 2014, 4:44 PM
Could you, please, clarify what the video demonstrates? As far as I can see you type in the filters of the two columns and filtering occurs (at least, the LoadArticles method executes) for both of them.

As for "uid" and "colid" ModelFields. Please try to set up some Type for them.

hdsoso
Jan 17, 2014, 11:17 PM
Could you, please, clarify what the video demonstrates? As far as I can see you type in the filters of the two columns and filtering occurs (at least, the LoadArticles method executes) for both of them.

As for "uid" and "colid" ModelFields. Please try to set up some Type for them.



<ext:ModelField Name="uid" Type="String"></ext:ModelField>
<ext:ModelField Name="QizUser" Type="Object"></ext:ModelField>
<ext:ModelField Name="colid" Type="String"></ext:ModelField>

thank you . resolved.