IntroductionThe ListSearchExtender provides the ability to search items in ListBox and DropDownList control by typing. It performs searching on the basis of typed input. Here are some properties of the ListSearchExtender, of which we will use in our application.
Now we take an ASP.NET Web Application and use the ListSearchExtender control. Follow the given steps.Step 1: At first go to Toolbox and take ScriptManager on form.Code on .aspx page<asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager>Step 2 : Take a ListSearchExtender control from the Toolbox.Code on .aspx page <asp:ListSearchExtender ID="ListSearchExtender1" runat="server"> </asp:ListSearchExtender>Step 3 : Take one Label and and one ListBox and place these into one Panel. Add some items into the ListBox and change the Text of the Label. The code on the .aspx page looks like below.<asp:Panel ID="Panel1" runat="server"> <h2 style="color:Red">Choose City</h2> <asp:Label ID="lblmessage" Font-Bold="true" Font-Size="15" ForeColor="Green" Text="At first click at ListBox and then type city name." runat="server"></asp:Label><br/><br /> <asp:ListBox ID="ListBox1" runat="server" SelectionMode="Multiple" ForeColor="#669900" Font-Size="15"> <asp:ListItem>Agra</asp:ListItem> <asp:ListItem>Aligarh</asp:ListItem> <asp:ListItem>Darbhanga</asp:ListItem> <asp:ListItem>Datia</asp:ListItem> <asp:ListItem>Dhanbad</asp:ListItem> <asp:ListItem>Faridabad</asp:ListItem> <asp:ListItem>Faizabad</asp:ListItem> <asp:ListItem>Delhi </asp:ListItem> <asp:ListItem>Jhansi</asp:ListItem> <asp:ListItem>Lucknow</asp:ListItem> <asp:ListItem>Varanasi</asp:ListItem> <asp:ListItem>Allahabad</asp:ListItem> </asp:ListBox> </asp:Panel>The form will look like in the following figure.Step 4 : Set the TargetControlID property of ListSearchExtender control to "ListBox1" ( ID of ListBox1 ). <asp:ListSearchExtender ID="ListSearchExtender1" TargetControlID="ListBox1" runat="server"> </asp:ListSearchExtender>Step 5 : Run the application. Now click in the Listbox. The output window will look like in the following figure.Now type any character of the beginning of a city name. You will note that the first city name whose first character matches the typed character will be selected in the ListBox.
Now we set some properties discussed above. Now I am adding CSS also.<asp:ListSearchExtender ID="ListSearchExtender1" TargetControlID="ListBox1" PromptText="search city" PromptPosition="Top" QueryPattern="StartsWith" IsSorted="true" PromptCssClass="PromptCSSClass" runat="server"> </asp:ListSearchExtender>
Now run the application and then click at ListBox.Suppose I am searching for city "Allahabad" which is in ListBox. You will note that it does not select this city.
Because this city is at last in ListBox control and we have set "IsSorted" property to true. So set is to false and search for any city. Run the application. Now search for any city.
Here are some related resources.
You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.
Become a sharper developer and jumpstart your career.
$0
$
. 00
monthly
For Basic members:
$20
For Premium members:
$45
For Elite members: