[CLOSED] Ability to search by either of the columns in a two-column Combobox
Hi,
I wish to type in values from either of the two columns in a two-column multipage combobox to find records I am looking for. Currently I can only filter down by one column that is defined in the DisplayField attribute. Is this possible? I have attached a sample code. I wish to search by either cust-no or name:
Code:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="SelectCustomerOnlyName.aspx.vb"
Inherits="EXTTabs.SelectCustomerOnlyName" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Me.Store1.DataSource = New Object() {New Object() {"12345", "ABC Ltd"}, New Object() {"5444", "XYZ Inc"}, New Object() {"67677", "Overseas Iron Works"}, New Object() {"234234", "Software Services"}, New Object() {"7765756", "Movie Zone"}, New Object() {"76866", "Johnson Clips"}, _
New Object() {"465464", "Sports House"}, New Object() {"57655", "Green House"}}
Me.Store1.DataBind()
btnOkCustomer.Disabled = True
End Sub
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
.cbCustomers-list th
{
font-weight: bold;
}
.cbCustomers-list td, .cbCustomers-list th
{
padding: 3px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name="cust-no" />
<ext:RecordField Name="name" />
</Fields>
</ext:ArrayReader>
</Reader>
<AutoLoadParams>
<ext:Parameter Name="start" Value="0" Mode="Raw" />
<ext:Parameter Name="limit" Value="5" Mode="Raw" />
</AutoLoadParams>
</ext:Store>
<ext:FormPanel ID="FormPanel1" runat="server" Width="600" Height="400" Title="Form Panel"
Padding="5" MonitorResize="true">
<Items>
<ext:ComboBox ID="cbCustomers" runat="server" EmptyText="Select Customer" TypeAhead="true"
ForceSelection="true" StoreID="Store1" EnableKeyEvents="true" Mode="Local" DisplayField="name"
ValueField="cust-no" MinChars="1" Width="450" ListWidth="450" PageSize="5" ItemSelector="tr.list-item">
<Template ID="Template1" runat="server">
<Html>
<tpl for=".">
<tpl if="[xindex] == 1">
<table class="cbCustomers-list">
<tr>
<th>Customer Name</th>
</tr>
</tpl>
<tr class="list-item">
<td style="padding:3px 0px;">{cust-no}</td>
<td>{name}</td>
</tr>
<tpl if="[xcount-xindex]==0">
</table>
</tpl>
</tpl>
</Html>
</Template>
<Triggers>
<ext:FieldTrigger Icon="Clear" HideTrigger="true" />
</Triggers>
<Listeners>
<BeforeQuery Handler="this.triggers[0][ this.getRawValue().toString().length == 0 ? 'hide' : 'show']();" />
<TriggerClick Handler="if (index == 0) { this.focus().clearValue(); trigger.hide();}" />
<Select Handler="this.triggers[0].show();btnOkCustomer.enable();" />
<TriggerClick Handler="if (index == 0) {this.focus().clearValue();trigger.hide(); btnOkCustomer.disable();}" />
</Listeners>
</ext:ComboBox>
</Items>
<Buttons>
<ext:Button ID="btnOkCustomer" Text="OK" runat="server" FormBind="true" AnchorHorizontal="90%">
</ext:Button>
</Buttons>
</ext:FormPanel>
</form>
</body>
</html>
Thanks
Ravi Swaminathan
Re: Ability to search by either of the columns in a two-column Combobox
Thanks, Daniil,
If I needed to search for items that contain all letters that I typed in instead of just the last letter that I typed, what would be solution be?
For example, the combo items contain: hycbed and ixcbd.
If I type in cbd it should filter down to cbd and not hycbed as it does now.
Thanks
Ravi Swaminathan
Re: Ability to search by either of the columns in a two-column Combobox
Thanks, Daniil.
I was clicking the dropdown arrow which seemed to cause the issue I faced.
Ravi Swaminathan
