Hi Fabricio
Thanks for your quick response.
Yes you can move it to 2.x
here is the sample code :
<script type="text/javascript">
TestExtractionProtocol = {
ExpComboSelect: function (combo, records, eOpts) {
var cmVal = combo.getValue();
combo.getTrigger(0).show();
if (combo.id == "ExpClientListCombo1") {
App.storeEXPPackageList1.clearFilter();
App.ExpFQListCombo1.getStore().clearFilter();
App.storeEXPPackageList1.filter('ClientId', cmVal);
App.ExpFQListCombo1.getStore().filter('ClientId', cmVal);
App.ExpPackageListCombo1.reset();
App.ExpPackageListCombo1.focus();
App.ExpFQListCombo1.reset();
}
else if (combo.id == "ExpPackageListCombo1") {
App.ExpFQListCombo1.getStore().clearFilter();
App.ExpFQListCombo1.getStore().filter('PackageId', cmVal);
App.ExpFQListCombo1.reset();
App.ExpFQListCombo1.focus();
}
else if (combo.id == "ExpFQListCombo1") {
}
},
clearFilterExp: function (me) {
me.clearValue();
me.getTrigger(0).hide();
if (me.id == 'ExpClientListCombo1') {
App.storeEXPPackageList1.clearFilter();
App.ExpPackageListCombo1.getTrigger(0).hide();
App.ExpPackageListCombo1.clear();
App.ExpFQListCombo1.getStore().clearFilter();
App.ExpFQListCombo1.getTrigger(0).hide();
App.ExpFQListCombo1.clear();
}
else if (me.id == 'ExpPackageListCombo1') {
App.ExpFQListCombo1.getStore().clearFilter();
App.ExpFQListCombo1.getTrigger(0).hide();
App.ExpFQListCombo1.clear();
App.storeEXPPackageList1.clearFilter();
App.ExpPackageListCombo1.clear();
}
else if (me.id == "ExpFQListCombo1") {
App.ExpFQListCombo1.clear();
window.setTimeout(function () {
if (App.ExpPackageListCombo1.getValue() != null && App.ExpPackageListCombo1.getValue().toString().trim() != "")
App.ExpFQListCombo1.getStore().filter("PackageId", App.ExpPackageListCombo1.getValue().toString());
else if (App.ExpClientListCombo1.getValue() != null && App.ExpClientListCombo1.getValue().toString().trim() != "")
App.ExpFQListCombo1.getStore().filter("ClientId", App.ExpClientListCombo1.getValue().toString());
}, 50);
}
},
filterComboOnKeyUp: function (combo, event, fn) {
if ((event.keyCode >= 96 && event.keyCode <= 105) || (event.keyCode >= 65 && event.keyCode <= 90) || event.keyCode == 8 || event.keyCode == 46) {
try {
combo.getTrigger(0).show();
}
catch (exc) {
console.log(exc);
}
if (event.keyCode == 8 || event.keyCode == 46) {
if (combo.getRawValue() == null || combo.getRawValue().trim() == "")
combo.getStore().clearFilter();
if (combo.id == "ExpPackageListCombo1") {
App.storeEXPPackageList1.clearFilter();
App.storeEXPPackageList1.filter("ClientId", App.ExpClientListCombo1.getValue().toString());
}
}
if (combo.id == "ExpPackageListCombo1") {
App.storeEXPPackageList1.clearFilter();
window.setTimeout(function () {
if (combo.getRawValue() != null && combo.getRawValue().trim() != "")
App.storeEXPPackageList1.filter("PackageName", new RegExp(combo.getRawValue(), "i"));
}, 10);
}
else if (combo.id == "ExpFQListCombo1") {
window.setTimeout(function () {
if (App.ExpPackageListCombo1.getValue() != null && App.ExpPackageListCombo1.getValue().toString().trim() != "")
combo.getStore().filter("PackageId", App.ExpPackageListCombo1.getValue().toString());
else
combo.getStore().filter("ClientId", App.ExpClientListCombo1.getValue().toString());
window.setTimeout(function () {
if (combo.getRawValue() != null && combo.getRawValue().trim() != "")
combo.getStore().filter('FQName', new RegExp(combo.getRawValue(), "i"), true, false);
}, 100);
}, 100);
}
}
},
ExpComboBoxReady: function () {
clientList = []; a = 1;
packageList = []; b = 1;
fqList = []; c = 1;
for (var i = 1; i <= 10 ; i++) {
clientList.push({ ClientId: i, ClientName: "Client " + i });
for (var j = 1; j <= 10 ; j++) {
packageList.push({ ClientId: i, PackageId: b, PackageName: "Package " + b });
for (var k = 1; k <= 50 ; k++) {
fqList.push({ ClientId: i, PackageId: b, FQId: c, FQName: "FQ " + c });
c++;
}
b++;
}
}
App.storeEXPClientList1.removeAll();
App.storeEXPClientList1.add(clientList);
App.storeEXPPackageList1.removeAll();
App.storeEXPPackageList1.add(packageList);
App.storeEXPFQList1.removeAll();
App.storeEXPFQList1.add(fqList);
App.ExpClientListCombo1.anyMatch = true;
App.ExpClientListCombo1.enableRegEx = false;
App.ExpClientListCombo1.bindStore(App.storeEXPClientList1);
App.ExpClientListCombo1.displayField = 'ClientName';
App.ExpClientListCombo1.valueField = 'ClientId';
//App.ExpClientListCombo1.getStore().sort();
App.ExpPackageListCombo1.anyMatch = true;
App.ExpPackageListCombo1.enableRegEx = false;
App.ExpPackageListCombo1.bindStore(App.storeEXPPackageList1);
App.ExpPackageListCombo1.displayField = 'PackageName';
App.ExpPackageListCombo1.valueField = 'PackageId';
//App.storeEXPPackageList1.sort();
App.ExpFQListCombo1.anyMatch = true;
App.ExpFQListCombo1.enableRegEx = false;
App.ExpFQListCombo1.bindStore(App.storeEXPFQList1);
App.ExpFQListCombo1.displayField = 'FQName';
App.ExpFQListCombo1.valueField = 'FQId';
//App.ExpFQListCombo1.getStore().sort();
},
}
</script>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="supportResourceManager" runat="server" DirectMethodNamespace="DM">
</ext:ResourceManager>
<ext:Panel runat="server" ID="pnlParent" ItemID="pnlParent" Height="500px" Border="true" Layout="FitLayout">
<Items>
<ext:Container runat="server" Layout="HBoxLayout" ID="cntClient">
<Items>
<ext:ComboBox ID="ExpClientListCombo1" EnableRegEx="true" ItemID="ExpClientListCombo1" QueryMode="Local" runat="server" DisplayField="ClientName"
Width="280" LabelWidth="83" ValueField="ClientId" FieldLabel="Client Name" MatchFieldWidth="true" TypeAhead="true" MarginSpec="15 0 0 15">
<Store>
<ext:Store runat="server" ID="storeEXPClientList1" ItemID="storeEXPClientList1" Namespace="App" AutoLoad="true" AutoDataBind="true" AutoDestroy="false">
<Model>
<ext:Model runat="server" ID="modelclientlstEP" IDProperty="ClientId">
<Fields>
<ext:ModelField Name="ClientId"></ext:ModelField>
<ext:ModelField Name="ClientName"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Listeners>
<Select Fn="TestExtractionProtocol.ExpComboSelect"></Select>
<TriggerClick Handler="TestExtractionProtocol.clearFilterExp(this);"></TriggerClick>
<AfterRender Fn="TestExtractionProtocol.ExpComboBoxReady" Delay="1000"></AfterRender>
</Listeners>
<Triggers>
<ext:FieldTrigger Icon="Clear" HideTrigger="true"></ext:FieldTrigger>
</Triggers>
</ext:ComboBox>
<ext:ComboBox ID="ExpPackageListCombo1" ItemID="ExpPackageListCombo1" runat="server" QueryMode="Local" DisplayField="PackageName"
Width="290" LabelWidth="95" ValueField="PackageId" FieldLabel="Package Name" MatchFieldWidth="true" TypeAhead="true" MarginSpec="15 0 0 15"
EnableKeyEvents="true" AutoScroll="true">
<Store>
<ext:Store runat="server" ID="storeEXPPackageList1" ItemID="storeEXPPackageList1" Namespace="App" AutoLoad="true" AutoDataBind="true" AutoDestroy="false" SortOnFilter="true">
<Model>
<ext:Model runat="server" ID="modelpackagelstEP" IDProperty="PackageId">
<Fields>
<ext:ModelField Name="ClientId"></ext:ModelField>
<ext:ModelField Name="PackageId"></ext:ModelField>
<ext:ModelField Name="PackageName"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Listeners>
<Select Fn="TestExtractionProtocol.ExpComboSelect"></Select>
<TriggerClick Handler="TestExtractionProtocol.clearFilterExp(this);"></TriggerClick>
<KeyUp Fn="TestExtractionProtocol.filterComboOnKeyUp"></KeyUp>
</Listeners>
<Triggers>
<ext:FieldTrigger Icon="Clear" HideTrigger="true"></ext:FieldTrigger>
</Triggers>
</ext:ComboBox>
<ext:ComboBox ID="ExpFQListCombo1" ItemID="ExpFQListCombo1" runat="server" QueryMode="Local" Width="250" LabelWidth="25"
DisplayField="FQName" ValueField="FQId" FieldLabel="FQ" MatchFieldWidth="true"
MarginSpec="15 0 0 15" TypeAhead="true" >
<Store>
<ext:Store runat="server" ID="storeEXPFQList1" ItemID="storeEXPFQList1" Namespace="App" AutoLoad="true" AutoDataBind="true" AutoDestroy="false" SortOnFilter="true">
<Model>
<ext:Model runat="server" ID="modelfqlistEP" IDProperty="FQId">
<Fields>
<ext:ModelField Name="ClientId"></ext:ModelField>
<ext:ModelField Name="PackageId"></ext:ModelField>
<ext:ModelField Name="FQId"></ext:ModelField>
<ext:ModelField Name="FQName"></ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Listeners>
<Select Fn="TestExtractionProtocol.ExpComboSelect"></Select>
<TriggerClick Handler="TestExtractionProtocol.clearFilterExp(this);"></TriggerClick>
<KeyUp Fn="TestExtractionProtocol.filterComboOnKeyUp"></KeyUp>
</Listeners>
<Triggers>
<ext:FieldTrigger Icon="Clear" HideTrigger="true"></ext:FieldTrigger>
</Triggers>
</ext:ComboBox>
</Items>
</ext:Container>
</Items>
</ext:Panel>
</div>
</form>
</body>
Also note that i am not using "TestExtractionProtocol.filterComboOnKeyUp".
Its just for reference that, i have used this function because the filter didn't work on type.
This code is written in aspx page and it does have aspx.cs (server side) page, but its empty. I have not used any server side method.
I just want that on typing in combo it should filter automatically, so that i dont need to add any extra code to filter combo.
Let me know if you need any more information.
Thanks.
