Make sure to include a control named ProductType of type textbox in your .aspx page.
[WebMethod(EnableSession = true)]
public static List<string> GetAutoCompleteDataProduct(string ProductType)
{
// string pid = "";
ProductMasterBL objProductMasterBl = new ProductMasterBL();
DataTable dtSearchProducts = objProductMasterBl.GetProductTypes(ProductType);
List<string> result = new List<string>();
for (int i = 0; i < dtSearchProducts.Rows.Count; i++)
{
result.Add(dtSearchProducts.Rows[i]["ProductName"].ToString());
}
if (result.Count == 0)
{
result.Add("No match found.");
}
return result;
}
The corresponding code behind:
$(document).ready(function () {
SearchText();
});
function SearchText() {
// var txtSearch = document.getElementById('txtProductType');
$("#txtProductType").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Customers.aspx/GetAutoCompleteDataProduct",
data: "{'ProductType':'" + request.term +"'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
},
focus: function () {
// prevent value inserted on focus
return false;
},
});
}
});
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />
This block of code encompasses the code behind logic, JavaScript functions, and essential script links for functionality