May 28, 2019 12:28 by
Peter
In this article, I will tell you how to create TextBox AutoComplete using JQuery or JSON in ASP.NET. First, create project in ASP.NET, then write the following code:
.Aspx Page
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>ASP.NET TextBox AutoCaomplete using JQuery or JSON</title>
<link rel="stylesheet"
href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"/>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function () {
var arr = [];
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "JQueryAutoCompleteJSON.aspx/GetEmployeeName",
data: "{}",
dataType: "json",
success: function (data) {
for (var i = 0; i < data.d.length; i++) {
arr[i] = data.d[i].empName;
}
},
error: function (result) {
alert("Error");
}
});
$("#tags").autocomplete({
source:arr
});
});
</script>
<style type="text/css">
table,th,td
{
border:1px solid black;
border-collapse:collapse;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
</form>
</body>
</html>
C#
using System.Web.Services;
using System.Data.SqlClient;
using System.Data;
using System.Configuration;
public partial class JQueryAutoCompleteJSON : System.Web.UI.Page
{
[WebMethod]
public static EmpDetails[] GetEmployeeName()
{
DataTable dt = new DataTable();
List<EmpDetails> empNames = new List<EmpDetails>();
SqlConnection con = newSqlConnection(ConfigurationManager.ConnectionStrings["con"].ConnectionString);
SqlCommand cmd = new SqlCommand("select * from employee", con);
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
foreach (DataRow drow in dt.Rows)
{
EmpDetails emp = new EmpDetails();
emp.empName = drow["name"].ToString();
empNames.Add(emp);
}
con.Close();
return empNames.ToArray();
}
public class EmpDetails
{
public string empName { get; set; }
}}
VB.NET
Imports System.Web.Services
Imports System.Data.SqlClient
Imports System.Data
Imports System.Configuration
Partial Public Class JQueryAutoCompleteJSON
Inherits System.Web.UI.Page
<WebMethod()> _
Public Shared Function GetEmployeeName() As EmpDetails()
Dim dt As New DataTable()
Dim empNames As New List(Of EmpDetails)()
Dim con As NewSqlConnection(
ConfigurationManager.ConnectionStrings("con").ConnectionString)
Dim cmd As New SqlCommand("select * from employee", con)
con.Open()
Dim da As New SqlDataAdapter(cmd)
da.Fill(dt)
For Each drow As DataRow In dt.Rows
Dim emp As New EmpDetails()
emp.empName = drow("name").ToString()
empNames.Add(emp)
Next
con.Close()
Return empNames.ToArray()
End Function
Public Class EmpDetails
Public Property empName() As String
Get
Return m_empName
End Get
Set(ByVal value As String)
m_empName = Value
End Set
End Property
Private m_empName As String
End Class
End Class
HostForLIFE.eu ASP.NET Core 2.2.4 Hosting
HostForLIFE.eu is European Windows Hosting Provider which focuses on Windows Platform only. We deliver on-demand hosting solutions including Shared hosting, Reseller Hosting, Cloud Hosting, Dedicated Servers, and IT as a Service for companies of all sizes. We have customers from around the globe, spread across every continent. We serve the hosting needs of the business and professional, government and nonprofit, entertainment and personal use market segments.