How to make an auto complete textbox without using ajax?

Question

1.00/5 (3 votes)

See more:

Hi guys!

I would like to create a text box that will auto complete the field name ContractNo from my database without using ajax. Any help?
here is what i tried:
In my .ASPX

XML

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

<head>
<title>AutoComplete Textbox with webservice using jQuery</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<script type="text/javascript">

$(document).ready(function () {
   SearchText();
});
function SearchText() {
   $(".autosuggest").autocomplete({
      source: function (request, response) {
         $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "AutoComplete.asmx/GetAutoCompleteData",
            data: "{'username':'" + document.getElementById('contract_num').value + "'}",
            dataType: "json",
            success: function (data) {
               response(data.d);
            },
            error: function (result) {
               alert("Error");
            }
         });
      }
   });
}
</script>
</head>

I add a Web service Method:

C#

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Data;
using System.Data.SqlClient;

///

/// Summary description for AutoComplete
///

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class AutoComplete : System.Web.Services.WebService {

   public AutoComplete () {
   //Uncomment the following line if using designed components
   //InitializeComponent();
   }

   [WebMethod]
   public List GetAutoCompleteData(string username)
   {
      List result = new List();
      using (SqlConnection con = new SqlConnection("Data Source=192.168.100.252;Integrated Security=true;Initial Catalog=AMICASSA_Checklist"))
      {
         using (SqlCommand cmd = new SqlCommand("select DISTINCT Contract_num from rawdata where Contact_num LIKE '%'+@SearchText+'%'", con))
         {
            con.Open();
            cmd.Parameters.AddWithValue("@SearchText", username);
            SqlDataReader dr = cmd.ExecuteReader();
            while (dr.Read())
            {
               result.Add(dr["Contract_num"].ToString());
            }
            return result;
         }
      }
   }
}

But nothing Happens :(

Posted 31-Aug-14 23:12pm

DarkDreamer08

Updated 1-Sep-14 22:53pm

Nelek

v6

Add a Solution

Comments

Nelek 1-Sep-14 5:28am

What have you tried?[^]

DarkDreamer08 1-Sep-14 20:58pm

here is what i tried:
In my .ASPX
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

<head>
<title>AutoComplete Textbox with webservice using jQuery</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
SearchText();
});
function SearchText() {
$(".autosuggest").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "AutoComplete.asmx/GetAutoCompleteData",
data: "{'username':'" + document.getElementById('contract_num').value + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
}
});
}
});
}
</script>
</head>

I add a Web service Method:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Data;
using System.Data.SqlClient;

///

/// Summary description for AutoComplete
///

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class AutoComplete : System.Web.Services.WebService {

public AutoComplete () {

//Uncomment the following line if using designed components
//InitializeComponent();
}

[WebMethod]
public List<string> GetAutoCompleteData(string username)
{
List<string> result = new List<string>();
using (SqlConnection con = new SqlConnection("Data Source=192.168.100.252;Integrated Security=true;Initial Catalog=AMICASSA_Checklist"))
{
using (SqlCommand cmd = new SqlCommand("select DISTINCT Contract_num from rawdata where Contact_num LIKE '%'+@SearchText+'%'", con))
{
con.Open();
cmd.Parameters.AddWithValue("@SearchText", username);
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
result.Add(dr["Contract_num"].ToString());
}
return result;
}
}
}

}

But nothing Happens :(

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 2-Sep-14 1:42am

Why without using Ajax? What is the issue? You can easily do this using jQuery or Ajax Control Toolkit.

DarkDreamer08 2-Sep-14 3:09am

I do not know on how to use AJAX. I am not that good at jQuery. I am really sorry ! :(

DarkDreamer08 2-Sep-14 21:53pm

How to use Ajax Control tool kit? should I download it?

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) 3-Sep-14 2:20am

Wait I am giving you an article link.

3 solutions

Solution 1

You could, you know, search[^] before you ask.

Posted 1-Sep-14 0:24am

Sinisa Hajnal

Solution 2

You Can use ajax toolkit to solve auto complate probleam
easilly download free and latest version is 4.5
i recommended you to use 4.0 version.

Posted 1-Sep-14 0:29am

RMBHATTI

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ) · Accepted Answer · 2014-09-02T20:22:00

Solution 3

Refer the following articles.

1. Ajax AutoCompleteExtender example or sample without using webservice (or) Asp.Net AJAX AutoComplete Extender From Database without using webservice[^]
2. AJAX AutoCompleteExtender Example in ASP.Net[^]

Posted 2-Sep-14 20:22pm

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

Comments

DarkDreamer08 15-Sep-14 21:33pm

Please Help me here :) http://www.codeproject.com/Questions/817498/How-to-Copy-From-Excel-and-Paste-it-into-a-Grid-Vi