1
Answer

JQuery - Auto Complete Text Box In ASP.Net C#

AHMED HUSSAIN

AHMED HUSSAIN
6y
2.1k
1
Hi!
 
Greetings of the day!
 
I am developing webform application in asp.net C# in Visual Studio 2015.
 
For implementing Autocomplete, I downloaded zip file here on C#Corner andun-zip them.
 
I created a new solution webform WebApplication1 (not emptyone) in asp.net C# in Visual Studio 2015, which creates Site.Master, Default.aspx, Default.aspx.cs, Web.config etc by default.
 
I pasted the CODE from downloaded files to Default.aspx, Default.aspx.cs also pasted the Jquery files to Scripts Folder and changed the path in src accordingly.
 
I am able to run the app in browser By removing the words WebApplication1 from the inheritance in line 1 of aspx, <form runat="server">, runat="server" from <html runat=server>.
 
I never done anything with with 2 dowloaded files jquery.ui.css and web.config.
 
my final Default.aspxcode is:
  1. <%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="_Default" %>  
  2.   
  3. <asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">  
  4. <<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  5. <html>  
  6. <head>  
  7. <title>AutoComplete Text Box using jQuery in ASP.NET</title>  
  8. <link href="jquery-ui.css" rel="stylesheet" type="text/css" />  
  9. <script src="jquery.min.js" type="text/javascript"></script>  
  10. <script src="jquery-ui.min.js" type="text/javascript"></script>  
  11.   
  12. <script type="text/javascript">  
  13. $(document).ready(function() {  
  14. SearchText();  
  15. });  
  16. function SearchText() {  
  17. $("#txtEmpName").autocomplete({  
  18. source: function(request, response) {  
  19. $.ajax({  
  20. type: "POST",  
  21. contentType: "application/json; charset=utf-8",  
  22. url: "Default.aspx/GetEmployeeName",  
  23. data: "{'empName':'" + document.getElementById('txtEmpName').value + "'}",  
  24. dataType: "json",  
  25. success: function(data) {  
  26. response(data.d);  
  27. },  
  28. error: function(result) {  
  29. alert("No Match");  
  30. }  
  31. });  
  32. }  
  33. });  
  34. }  
  35. </script>  
  36. </head>  
  37. <body>  
  38. <asp:TextBox ID="txtEmpName" runat="server" Width="160px" />  
  39. </body>  
  40. </html>  
  41. </asp:Content>  
my final Default.aspx.cs code is:
  1. using System;  
  2. using System.Configuration;  
  3. using System.Data;  
  4. using System.Linq;  
  5. using System.Web;  
  6. using System.Web.Security;  
  7. using System.Web.UI;  
  8. using System.Web.UI.HtmlControls;  
  9. using System.Web.UI.WebControls;  
  10. using System.Web.UI.WebControls.WebParts;  
  11. using System.Xml.Linq;  
  12. using System.Web.Services;  
  13. using System.Data.SqlClient;  
  14. using System.Collections.Generic;  
  15. public partial class _Default : System.Web.UI.Page  
  16. {  
  17. protected void Page_Load(object sender, EventArgs e)  
  18. {  
  19. }  
  20. [WebMethod]  
  21. public static List<string> GetEmployeeName(string empName)  
  22. {  
  23. string connStr = @"Data Source=(LocalDB)\MSSQLLocalDB;" +  
  24. @"AttachDbFilename=|DataDirectory|\Database1.mdf;  
  25. Integrated Security=True;  
  26. Connect Timeout=30";  
  27. List<string> empResult = new List<string>();  
  28. using (SqlConnection con = new SqlConnection(connStr))  
  29. {  
  30. using (SqlCommand cmd = new SqlCommand())  
  31. {  
  32. cmd.CommandText = "SELECT name FROM student WHERE name LIKE ''+@SearchEmpName+'%'";  
  33. cmd.Connection = con;  
  34. con.Open();  
  35. cmd.Parameters.AddWithValue("@SearchEmpName", empName);  
  36. SqlDataReader dr = cmd.ExecuteReader();  
  37. while (dr.Read())  
  38. {  
  39. empResult.Add(dr["name"].ToString());  
  40. }  
  41. con.Close();  
  42. return empResult;  
  43. }  
  44. }  
  45. }  
  46. }  
Nothing is showing when I type characters in test box.
 
When I apply Run Code Analysis on Solution, I am getting 2 Warings as below:
 
Severity Code Description Project File Line
1) Warning Validation (HTML5): Element 'html' cannot be nested within element 'div'. WebApplication1 C:\Users\Ahmed\documents\visual studio 2015\Projects\WebApplication1\WebApplication1\Default.aspx 5
2) Severity Code Description Project File Line
Warning CA2202 Object 'con' can be disposed more than once in method '_Default.GetEmployeeName(string)'. To avoid generating a System.ObjectDisposedException you should not call Dispose more than one time on an object.: Lines: 48 WebApplication1 C:\Users\Ahmed\documents\visual studio 2015\Projects\WebApplication1\WebApplication1\Default.aspx.cs 48
 
PLEASE HELP ME.
Thanks in advance.
Answers (1)
Next Recommended Forum