ENTech Solutions : How to add AutoSuggestMenu to your ASP.NET project

Download and add required files

Download the "AutoSuggestMenu" package from here
Unzip the file into a directory on your system
Open new or already existing web application in Visual Studio .NET
Add reference to "AutoSuggestMenu.dll"

Right click on the project in Solution Explorer and select "Add Reference"
Click on 'Browse' button in the top right corner
Go to directory where you unzipped the files, select "AutoSuggestMenu.dll" and click "Open"
AutoSuggestMenu should now appear in the references folder of your project

Copy AutoSuggestMenu resource files into your project

Run 'Windows Explorer' and open the directory where you unzipped the files in step 2
Right-click on sub-directory 'asm_includes' and select 'copy'
Switch back to Visual Studio
Right-click on the web project in 'Solution Explorer' and select 'paste'.
You should see 'asm_includes' sub-directory appear in your web project.
The sub-directory should contain AutoSuggestMenu.css, AutoSuggestMenu.js, AutoSuggestMenuItem.js, Blank.html and XUtils.js

Add AutoSuggestMenu control to a web form

Create or open already existing web form

Add the following line to the top of your ASPX page:

<%@ Register TagPrefix="Custom" Namespace="AutoSuggestMenu" Assembly="AutoSuggestMenu" %>

Add the following line to location where you want suggest box to appear


<Custom:AutoSuggestMenu id="Control ID" 
                            targetControlID="ID of the Text Box" 
                            OnGetSuggestions="Server-side method to load suggestions. Defaults to GetSuggestions." 
                            runat="server"/>

For example:


<asp:TextBox id="txtCity" runat="server" MaxLength="100" Columns="30" runat="server"/>   
       
<Custom:AutoSuggestMenu id="asmCity" 
                            targetControlID="txtCity" 
                            OnGetSuggestions="GetCitySuggestions" 
                            runat="server"/>

If your "asm_includes" directory is not under root of your web application - you can point to it using AutoSuggestMenu.ResourcesDir property.


<Custom:AutoSuggestMenu id="asmCity" 
                        OnGetSuggestions="GetCitySuggestions" 
                        ResourcesDir="~/Includes/AutoSuggestMenu" 
                        runat="server"/>

NOTE: By default the ResourcesDir is "~/asm_includes".

Loading suggestions
When user starts typing in a text box you need to load suggestions depending on what the user typed.

There are several ways to load suggestions from the server side. Please click here for detailed descriptions of various approaches.

Now build it and ENJOY!!!
If you encounter any problems please contact us here