[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now


Auto Suggest Box Control

Posted on 2007-07-23
Medium Priority
Last Modified: 2012-06-27

I found this control... Can somebody give me walk through to make it work with SQL database?


Question by:CalmSoul
  • 2

Accepted Solution

Chirag1211 earned 1500 total points
ID: 19553707
Download and add required files

Download the "AutoSuggestBox" control 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 "AutoSuggestBox.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 "AutoSuggestBox.dll" and click "Open"
AutoSuggestBox should now appear in the references folder of your project
Copy AutoSuggestBox 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 'asb_includes' and select 'copy'
Switch back to Visual Studio
Right-click on the web project in 'Solution Explorer' and select 'paste'.
You should see 'asb_includes' sub-directory appear in your web project.
The sub-directory should contain AutoSuggestBox.css, AutoSuggestBox.js, Blank.html and GetAutoSuggestData.aspx

Specify available data types
When user starts typing in AutoSuggestBox you need to provide a data source for suggested values. The system allows for as many data source as required by your application. For example you can have one data source for 'City' suggest box, another for 'Airport'.

To add data source please follow these steps:
Open /AutoSuggestBox/GetAutoSuggestData.aspx.cs (or '.aspx.vb' if using VB.NET)
NOTE: The ASPX portion of the file is empty.
Scroll to the bottom of the file, where you will find function

private ArrayList LoadMenuItems()'
By default the function contains implementation of "City" datasource
You can remove "city" implementation and replace it with your own
If you need to add other data sources, just add more case statements to LoadMenuItems function

Add AutoSuggestBox 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="ASB" Assembly="AutoSuggestBox" %>
Add the following line to location where you want suggest box to appear

<Custom:AutoSuggestBox id="Control ID" DataType="Supported Data Type" runat="server" CssClass="Text Box Style" MaxLength="Max chars in TextBox" Columns="Num of visible chars"/>

For example:

<Custom:AutoSuggestBox id="asbCity" DataType="City" runat="server" CssClass="FormCtrlStyle" MaxLength="100" Columns="30"/>
Make sure that value of DataType attribute has been implemented in 'GetAutoSuggestData.aspx.cs' See previous section.
If your web application doesn't run in the root of the webserver (ex. http://localhost/WebApp), then you need to add 'ResourcesDir' attribute to autosuggestbox tag:
<Custom:AutoSuggestBox id="asbCity" DataType="City" runat="server" CssClass="FormCtrlStyle" MaxLength="100" Columns="30" ResourcesDir="/WebApp/AutoSuggestBox"/>

NOTE: By default the ResourcesDir is "/asb_includes".


Chirag Patel

Author Comment

ID: 19556853
Can you please explain further on "Specify available data types"? also I want to add SQL connection instead of access? How I can do that?

   Private Function LoadCities(ByVal sKeyword As String) As ArrayList
        Dim aOut As ArrayList = New ArrayList

        Dim sConnString As String = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=c:\Inetpub\wwwroot\Ajax\Database\AutoSuggestBox_Demo.mdb;User Id=admin;Password=;"
        Dim oCn As OleDbConnection = New OleDbConnection(sConnString)

        Dim sSql As String
        sSql = "SELECT TOP " & (mnNumMenuItems + 1) & " tblCity.Name as CityName, " & _
                    "tblCity.Code as CityCode, " & _
                    "tblCountry.Name as CountryName, " & _
                    "tblState.Name as StateName " & _
                  " FROM (tblCity INNER JOIN tblCountry ON tblCity.CountryID=tblCountry.ID) " & _
                    "            LEFT OUTER JOIN tblState ON tblCity.StateID=tblState.ID " & _
                  " WHERE (tblCity.Name LIKE '" + sKeyword.Replace("'", "''") + "%') " & _
                  " ORDER BY tblCity.Name"

Author Comment

ID: 19620226
Please close the question...

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A quick way to get a menu to work on our website, is using the Menu control and assign it to a web.sitemap using SiteMapDataSource. Example of web.sitemap file: (CODE) Sample code to add to the page menu: (CODE) Running the application, we wi…
User art_snob (http://www.experts-exchange.com/M_6114203.html) encountered strange behavior of Android Web browser on his Mobile Web site. It took a while to find the true cause. It happens so, that the Android Web browser (at least up to OS ver. 2.…
Is your OST file inaccessible, Need to transfer OST file from one computer to another? Want to convert OST file to PST? If the answer to any of the above question is yes, then look no further. With the help of Stellar OST to PST Converter, you can e…
With just a little bit of  SQL and VBA, many doors open to cool things like synchronize a list box to display data relevant to other information on a form.  If you have never written code or looked at an SQL statement before, no problem! ...  give i…
Suggested Courses
Course of the Month18 days, 16 hours left to enroll

834 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question