Jul 25, 2012, 6:53 AM
[CLOSED] GridPanel with Header Filter, filterDate is not work
GridPanel with Header Filter, filterDate is not work?
Another problem is Date Can't Show....i do't know why?
My date format is "yyyy/MM/dd"
Maybe my date format is wrong? How to Set?
following is my code:
Another problem is Date Can't Show....i do't know why?
My date format is "yyyy/MM/dd"
Maybe my date format is wrong? How to Set?
following is my code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.refreshdata();
}
}
protected void refreshdata() //自寫function,主要為查詢用
{
object data =new object[] {
new object[] { "1", "test", "fa", "fa", "2012/7/25 上午 12:00:00" },
new object[] { "2", "test2", "fa2", "fa2", "2012/7/25 上午 12:00:00" }
};
this.Store1.DataSource = data;
this.Store1.DataBind();
}
protected void GridPanel_Refresh(object sender, StoreReadDataEventArgs e) //GridPanel 更新按紐
{
refreshdata();
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<ext:XScript ID="XScript1" runat="server">
<script type="text/javascript">
var applyFilter = function (field) {
var store = #{GridPanel1}.getStore();
store.filterBy(getRecordFilter());
};
var clearFilter = function () {
#{tfh_TS201}.reset();
#{tfh_TS203}.reset();
#{tfh_TS204}.reset();
#{df_TS205}.reset();
#{Store1}.clearFilter();
}
var filterString = function (value, dataIndex, record) {
var val = record.get(dataIndex);
if (typeof val != "string") {
return value.length == 0;
}
return val.toLowerCase().indexOf(value.toLowerCase()) > -1;
};
var filterDate = function (value, dataIndex, record) {
var val = Ext.Date.clearTime(record.get(dataIndex), true).getTime();
if (!Ext.isEmpty(value, false) && val != Ext.Date.clearTime(value, true).getTime()) {
return false;
}
return true;
};
var filterNumber = function (value, dataIndex, record) {
var val = record.get(dataIndex);
if (!Ext.isEmpty(value, false) && val != value) {
return false;
}
return true;
};
var getRecordFilter = function () {
var f = [];
f.push({
filter: function (record) {
return filterNumber(#{tfh_TS201}.getValue(), "TS201", record);
}
});
f.push({
filter: function (record) {
return filterString(#{tfh_TS203}.getValue()||"", "TS203", record);
}
});
f.push({
filter: function (record) {
return filterString(#{tfh_TS204}.getValue()||"", "TS204", record);
}
});
f.push({
filter: function (record) {
return filterDate(#{df_TS205}.getValue(), "TS205", record);
}
});
var len = f.length;
return function (record) {
for (var i = 0; i < len; i++) {
if (!f[i].filter(record)) {
return false;
}
}
return true;
};
};
</script>
</ext:XScript>
</head>
<body>
<form runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout">
<Items>
<ext:Toolbar ID="Toolbar1" runat="server" Region="North">
<Items>
<ext:Button ID="bt_query" runat="server" Text="_Query" Icon="Accept">
</ext:Button>
<ext:Button ID="bt_add" runat="server" Text="_Add" Icon="ApplicationAdd" >
</ext:Button>
<ext:Button ID="bt_edit" runat="server" Text="_Edit" Icon="ApplicationEdit" >
</ext:Button>
<ext:Button ID="bt_delete" runat="server" Text="_Delete" Icon="ApplicationDelete" >
</ext:Button>
<ext:Button ID="bt_conf" runat="server" Text="_Confirm" Icon="ApplicationLightning" >
</ext:Button>
<ext:Button ID="bt_void" runat="server" Text="_Void" Icon="BulletCross" >
</ext:Button>
<ext:Button ID="bt_print" runat="server" Text="_Print" Icon="Printer" >
</ext:Button>
<ext:Button ID="bt_export" runat="server" Text="_Export" Icon="ApplicationGet" AutoPostBack="true" >
</ext:Button>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
</Items>
</ext:Toolbar>
<ext:Panel ID="Panel2"
runat="server"
Region="Center"
Frame="true"
Title="Suppliers"
Icon="Lorry"
Layout="Fit"
MarginsSummary="0 5 0 5">
<Items>
<ext:GridPanel
ID="GridPanel1"
runat="server">
<Store>
<ext:Store
ID="Store1"
runat="server" OnReadData="GridPanel_Refresh"
PageSize="10">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="TS201">
<Fields>
<ext:ModelField Name="TS201" />
<ext:ModelField Name="TS203" />
<ext:ModelField Name="TS204" />
<ext:ModelField Name="TS205" Type="Date" DateFormat="yyyy/MM/dd" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="Column1" runat="server" DataIndex="TS201" Text="_TS201" Flex="1" >
<HeaderItems>
<ext:TextField ID="tfh_TS201" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</HeaderItems>
</ext:Column>
<ext:Column ID="Column3" runat="server" DataIndex="TS203" Text="_TS203" >
<HeaderItems>
<ext:TextField ID="tfh_TS203" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</HeaderItems>
</ext:Column>
<ext:Column ID="Column4" runat="server" DataIndex="TS204" Text="_TS204" >
<HeaderItems>
<ext:TextField ID="tfh_TS204" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</HeaderItems>
</ext:Column>
<ext:DateColumn ID="Column5" runat="server" DataIndex="TS205" Text="_TS205" >
<HeaderItems>
<ext:DateField ID="df_TS205" runat="server" Editable="false">
<Listeners>
<Select Handler="applyFilter(this);" />
</Listeners>
</ext:DateField>
</HeaderItems>
</ext:DateColumn >
<ext:Column ID="Column6" runat="server" Width="25" DataIndex="TS201" Sortable="false" MenuDisabled="true" Text=" " Fixed="true">
<Renderer Handler="return '';" />
<HeaderItems>
<ext:Container ID="Container1" runat="server">
<Items>
<ext:Button ID="ClearFilterButton" runat="server" Icon="Cancel">
<ToolTips>
<ext:ToolTip ID="ToolTip1" runat="server" Html="Clear filter" />
</ToolTips>
<Listeners>
<Click Handler="clearFilter(null);" />
</Listeners>
</ext:Button>
</Items>
</ext:Container>
</HeaderItems>
</ext:Column>
</Columns>
</ColumnModel>
<BottomBar>
<ext:PagingToolbar ID="PagingToolbar1" runat="server" />
</BottomBar>
</ext:GridPanel>
</Items>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Last edited by Daniil; Jul 26, 2012 at 8:28 AM.
Reason: [CLOSED]