Solved

jQuery Autocomplete : Is there a way to add two column in the droplist

Posted on 2009-05-05
1
2,155 Views
Last Modified: 2012-05-06
Hi, I am building a web application that requires to search part numbers.

I have set up the Autocomplete plugins from jQuery using a Generic Hanlder and it works fine.

I was wondering though if it is possible to have two columns in the droplist.

I search by Item Code and I'd like to have | ItemCode    | Description |  to show up in the droplist.

Thanks,
// Javascript
 

<script type="text/javascript">
 

$(document).ready(function(){

  $("#ctl00_ContentPlaceHolder1_txtSearchPart").autocomplete(

    "ctrl/AutocompleteData.ashx",

        {

            width: 500,

            scrollHeight: 230

        }

    );

  });
 

</script>
 
 

// Generic Hanlder
 

<%@ WebHandler Language="C#" Class="AutocompleteData" %>
 

using System;

using System.Web;

using System.Configuration;

using System.Data;

using System.Data.SqlClient;
 

public class AutocompleteData : IHttpHandler {

    

    public void ProcessRequest (HttpContext context) {

        string srValue = context.Request.QueryString["q"];

        string sql = "SELECT TOP 20 ItemCode FROM Items WHERE ItemCode like '" + srValue + "%'";
 

        using (SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["cn"].ConnectionString))

        using (SqlCommand cmd = new SqlCommand("sel_ajaxPartsCompletor", connection))

        {

            cmd.CommandType = CommandType.StoredProcedure;

            SqlParameter value = new SqlParameter("strValue", SqlDbType.VarChar);

            value.Value = srValue.ToString();

            cmd.Parameters.Add(value);

            connection.Open();
 

            using (SqlDataReader reader = cmd.ExecuteReader())

            {

                while (reader.Read())

                {

                    context.Response.Write(reader.GetString(0) + Environment.NewLine);

                }

            }

        }

    }

 

    public bool IsReusable {

        get {

            return false;

        }

    }
 

}

Open in new window

0
Comment
Question by:maxleb
1 Comment
 
LVL 13

Accepted Solution

by:
dungla earned 500 total points
ID: 24341310
Hi there,
http://www.codeproject.com/KB/ajax/jqueryajax.aspx this may help you out with Multi-column auto-complete
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

There are a couple ways to attach a JavaScript function to dynamically created elements. You can make a new script for each element as it’s created or you can use delegation. Delegation allows a single script that is added at page creation to mat…
PROBLEM: The other day I was working on adding an ajax request to a webpage that already had a dialog box on the page.  The dialog box was using relative positioning to be positioned next to a form field I had on the page.  Everything was working…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

947 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

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now