jQuery tutorial for beginners - Autocomplete textbox using jquery and asp net web service

Link for all dot net and sql server video tutorial playlists https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1 Link for slides, code samples and text version of the video http://csharp-video-tutorials.blogspot.com/2015/06/autocomplete-textbox-using-jquery-and.html Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help. https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1 In this video we will discuss, how to implement autocomplete textbox using jquery and asp.net web service. Along the way, we also discuss the jquery autocomplete source option and minLength option. jquery autocomplete source option can be set to 1. Array : An array of strings: [ "Choice1", "Choice2" ] OR An array of objects with label and value properties: [ { label: "Choice1", value: "value1" }, ... ] The label property is displayed in the suggestion menu. The value will be inserted into the input element when a user selects an item. 2. String: When a string is used, the Autocomplete plugin expects that string to point to a URL resource that will return JSON data. Discussed in Part 71. 3. Callback function. This function has two parameters. request object and a response callback function. The term property of the request object contains the value the user typed in the autocomplete textbox and to the response callback function you will have to pass the data to suggest to the user. jquery autocomplete minLength option : The minimum number of characters a user must type before a search is performed. Steps to implement autocomplete textbox in an asp.net webforms application using jQuery and asp.net web service. Stored procedure to retrieve employee names Create proc spGetStudentNames @term nvarchar(50) as Begin Select Name from tblStudents where Name like @term + '%' End WebService (ASMX) to retrieve StudentNames using System.Collections.Generic; using System.Configuration; using System.Data; using System.Data.SqlClient; using System.Web.Services; namespace Demo { [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] [System.Web.Script.Services.ScriptService] public class StudentService : System.Web.Services.WebService { [WebMethod] public List<string> GetStudentNames(string term) { List<string> listStudentNames = new List<string>(); string cs = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString; using (SqlConnection con = new SqlConnection(cs)) { SqlCommand cmd = new SqlCommand("spGetStudentNames", con); cmd.CommandType = CommandType.StoredProcedure; cmd.Parameters.Add(new SqlParameter() { ParameterName = "@term", Value = term }); con.Open(); SqlDataReader rdr = cmd.ExecuteReader(); while (rdr.Read()) { listStudentNames.Add(rdr["Name"].ToString()); } } return listStudentNames; } } } Download jQuery UI from jqueryui.com. Copy and paste the following files in your project. a) jquery-ui.js b) jquery-ui.css c) images