Jan 24, 2011, 6:43 AM
[CLOSED] Multi header filter grid error...after upgrade!!
Hi,
we upgraded our solution from Ext.NET 1.0 to the latest release Ext.NET 1.0(RC). we read the CHANGE.LOG and upgrade each component.
Problem:
after using the multi header filter grid (https://examples1.ext.net/#/GridPane...Header/Filter/) , we get a javascript error which prevents the grid from loading .
error:
//script
regards
Ilanga:cool:
we upgraded our solution from Ext.NET 1.0 to the latest release Ext.NET 1.0(RC). we read the CHANGE.LOG and upgrade each component.
Problem:
after using the multi header filter grid (https://examples1.ext.net/#/GridPane...Header/Filter/) , we get a javascript error which prevents the grid from loading .
error:
//script
<script type="text/javascript">
var applyFilter = function(field) {
if (field) {
var id = field.id,
task = new Ext.util.DelayedTask(function() {
var f = Ext.getCmp(id);
f.focus();
f.el.dom.value = f.el.dom.value;
});
task.delay(100);
}
EmpGridPanel.getStore().filterBy(getRecordFilter());
}
var clearFilter = function () {
EmpCodeFilter.reset();
SurnameFilter.reset();
FirstnameFilter.reset();
OtherNamesFilter.reset();
CadreFilter.reset();
DepartmentFilter.reset();
DesignationFilter.reset();
EmpGridPanel.getStore().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 = record.get(dataIndex).clearTime(true).getTime();
if (!Ext.isEmpty(value, false) && val != value.clearTime(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 filterString(EmpCodeFilter.getValue(), 'EMP_CODE', record);
}
});
f.push({
filter: function (record) {
return filterString(SurnameFilter.getValue(), 'SURNAME', record);
}
});
f.push({
filter: function (record) {
return filterString(FirstnameFilter.getValue(), 'FIRST_NAME', record);
}
});
f.push({
filter: function (record) {
return filterString(OtherNamesFilter.getValue(), 'OTHERNAMES', record);
}
});
f.push({
filter: function (record) {
return filterString(CadreFilter.getValue(), 'EMP_CADRE_CODE', record);
}
});
f.push({
filter: function(record) {
return filterString(DepartmentFilter.getValue(), 'DEPT_CODE', record);
}
});
f.push({
filter: function(record) {
return filterString(DesignationFilter.getValue(), 'DESGN_CODE', 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>
<View>
<ext:GridView ID="GridView1" runat="server">
<HeaderRows>
<ext:HeaderRow>
<Columns>
<ext:HeaderColumn Cls="x-small-editor" />
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:TextField ID="EmpCodeFilter" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:TextField ID="SurnameFilter" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:TextField ID="FirstnameFilter" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:TextField ID="OtherNamesFilter" runat="server" EnableKeyEvents="true">
<Listeners>
<KeyUp Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:TextField>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:ComboBox ID="CadreFilter" runat="server"
StoreID="SearchStore1"
TriggerAction="All"
Mode="Local"
DisplayField="EMP_CADRE_CODE"
ValueField="EMP_CADRE_CODE">
<Listeners>
<Select Handler="applyFilter(this);" Buffer="250" />
</Listeners>
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:ComboBox ID="DepartmentFilter" runat="server"
StoreID="SearchStore2"
TriggerAction="All"
Mode="Local"
DisplayField="DEPT_CODE"
ValueField="DEPT_CODE">
<Listeners>
<Select Handler="applyFilter(this);" />
</Listeners>
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn Cls="x-small-editor">
<Component>
<ext:ComboBox ID="DesignationFilter" runat="server"
StoreID="DesignationStore"
TriggerAction="All"
Mode="Local"
DisplayField="DESGN_CODE"
ValueField="DESGN_CODE">
<Listeners>
<Select Handler="applyFilter(this);" />
</Listeners>
</ext:ComboBox>
</Component>
</ext:HeaderColumn>
<ext:HeaderColumn AutoWidthElement="false">
<Component>
<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>
</Component>
</ext:HeaderColumn>
</Columns>
</ext:HeaderRow>
</HeaderRows>
</ext:GridView>
</View>
Please assistregards
Ilanga:cool:
Last edited by geoffrey.mcgill; Jan 24, 2011 at 3:01 PM.
Reason: [CLOSED], please use [CODE] tags