AutoComplete Textbox using jQuery and Asp.Net Web Service



AutoComplete Textbox using jQuery and Asp.Net Web Services


Below is the code for the web service which will handle the jQuery Autocomplete calls and will return the matching records from the Customers table of the Northwind database.
The select query gets the Name and the ID of the customer that matches the prefix text.
  1. <asp:textbox id="TextBox1" runat="server" viewstatemode="Enabled"></asp:textbox>
                                 <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">                            </script>
                                <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-                                                       ui.min.js"></script>
                                            <script type="text/javascript">
                                                $(function () {
                                                    $("[id$=TextBox1]").autocomplete({
                                                        source: function (request, response) {
                                                            $.ajax({
                                                                url: '<%=ResolveUrl("~/WebService.asmx/GetName") %>',
                                                                data: "{ 'jobcategory': '" + request.term + "'}",
                                                                dataType: "json",
                                                                type: "POST",
                                                                contentType: "application/json; charset=utf-8",
                                                                success: function (data) {
                                                                    response($.map(data.d, function (item) {
                                                                        return {
                                                                            label: item.split('-')[0],
                                                                            val: item.split('-')[1]
                                                                        }
                                                                    }))
                                                                },
                                                                error: function (response) {
                                                                    alert(response.responseText);
                                                                },
                                                                failure: function (response) {
                                                                    alert(response.responseText);
                                                                }
                                                            });
                                                        },
                                                        minLength: 1
                                                    });
                                                });
                                            </script>

Source Code C#

  1. using System.Web.Services;
     using System.Data.SqlClient; 
    using System.Configuration;
     using System.Web.Script.Services; 

     [WebMethod]
     [ScriptMethod(ResponseFormat = ResponseFormat.Json)]

      public List<string> Getrecord(string jobcategory)
        {
            List<string> Result = new List<string>();

            string constra = ConfigurationManager.ConnectionStrings["constra"].ConnectionString;
            SqlConnection con = new SqlConnection(constra);
            SqlConnection.ClearPool(con);
            SqlCommand cmd = new SqlCommand("select distinct Top 5  (City) from tblcity where City               like '" + jobcategory + "%'", con);
            cmd.CommandType = CommandType.Text;
            cmd.Connection = con;
            SqlDataAdapter sda = new SqlDataAdapter(cmd);
            DataTable ds = new DataTable();
            sda.Fill(ds);
            for (int i = 0; i < ds.Rows.Count; i++)
            {
                Result.Add(ds.Rows[i]["City"].ToString());
            }
            return Result;

Post a Comment

0 Comments