In this article I will explain how to create a autocomplete textbox using C# in ASP.Net.
Design a Search box and reference the jquery and paste the javascript code in exampleSearch.aspx
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<div>
Search: <asp:TextBox ID="txtSearch" runat="server"></asp:TextBox>
</div>
</asp:Content>
<script type="text/javascript">
$(document).ready(function () {
$("#MainContent_txtSearch").autocomplete({
source: function (request, response) {
var param = { keyword: $('#MainContent_txtSearch').val() };
$.ajax({
url: "Default.aspx/GetSearchResults",
data: JSON.stringify(param),
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
response( $.map(data.d, function (item) {
return {
value: item
}
}))
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
},
select: function (event, ui) {
if (ui.item) {
alert(ui.item.value);
GetCustomerDetails(ui.item.value);
}
},
minLength: 2
});
});
}
</script>
In exampleSearch.aspx.cs paste the webservice code and modiyfy SQL command as per your requirement. In webconfig change the connection String give datasource, user name and password of sql server.
[WebMethod]
public static string[] GetSearchResults(string keyword)
{
List<string> country = new List<string>();
string query = string.Format("SELECT DISTINCT Title FROM Post WHERE Title LIKE '%{0}%'", keyword);
using (SqlConnection con =
new SqlConnection(ConfigurationManager.ConnectionStrings["ApplicationServices"].ConnectionString))
{
using (SqlCommand cmd = new SqlCommand(query, con))
{
con.Open();
SqlDataReader reader = cmd.ExecuteReader();
while (reader.Read())
{
country.Add(reader.GetString(0));
}
}
}
return country.ToArray();
}
Output:
Search: how to
[solved] Pen drive folder is empty how to view files
How to add a column with a default value, to an existing table in SQL Server?
How to apply css for dropdownList in MVC .net?
How to bind dropdownlist in asp.net MVC using Entity framework.