Hi nauna,
Refer the below sample.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body
{
font-family: Arial;
font-size: 10pt;
}
table
{
border: 1px solid #ccc;
}
table th
{
background-color: #F7F7F7;
color: #333;
font-weight: bold;
}
table th, table td
{
padding: 5px;
border-color: #ccc;
}
</style>
<script src="scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="scripts/jquery.autocomplete.js" type="text/javascript"></script>
<link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function () {
$("#<%=txtSearch.ClientID%>").autocomplete("Search_CS.ashx", {
width: 200,
formatItem: function (data, i, n, value) {
var countryName = value.split("-")[0];
var countryId = value.split("-")[1];
return "<table onclick='AddCountry(this)'><tr><td><span>" + countryName + "</span></td><td><input type='hidden' id='hfCountryId' value='" + countryId + "' /></td></tr></table>";
},
formatResult: function (data, value) {
return value.split("-")[0];
}
});
});
function AddCountry(ele) {
var countryName = $(ele).find('span').text();
var id = $(ele).find("[id*=hfCountryId]").val();
var lbl = document.getElementById("<%=Label1.ClientID %>").value;
//Make ajax call to save the id and datetime in database;
$.ajax({
type: "POST",
url: "CS.aspx/SaveCountryId",
data: "{ id: '" + id + "', lbl: '" + lbl + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (r) {
alert(r.d);
},
error: function (r) { alert(r.responseText); },
failure: function (r) { alert(r.responseText); }
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table width="100%">
<tr>
<td>
Search:
</td>
<td>
<asp:TextBox ID="txtSearch" runat="server" Width="100%"></asp:TextBox>
</td>
<td>
<asp:HiddenField ID="Label1" runat="server" Value="00198" />
</td>
</tr>
</table>
</div>
</form>
</body>
</html>
C#
[WebMethod]
public static void SaveCountryId(string id, string lbl)
{
string i = "";
string ll = "";
if (!string.IsNullOrEmpty(id))
{
//string date = DateTime.Now.ToShortDateString();
i = id;
ll = lbl;
//Saving code goes here.
string constr = ConfigurationManager.ConnectionStrings["reloConnectionString2"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("INSERT INTO QuoteDetails VALUES(@QuoteKey, @SubCategoryId)"))
{
cmd.CommandType = CommandType.Text;
cmd.Parameters.AddWithValue("@QuoteKey", i);
cmd.Parameters.AddWithValue("@SubCategoryId", ll);
cmd.Connection = con;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}