Introduction
Alternative for the article
http://www.codeproject.com/script/Articles/ArticleVersion.aspx?waid=29267&aid=435836&msg=4331629#xx4331629xx
Ajax was one alternate, an alternate can be using jQuery
Background
For using jQuery autosuggest we need the js file
"jquery.ui.autocomplete.autoSelect.js". Refer this link for download and
help http://docs.jquery.com/UI/Autocomplete.
Using the Code
Once you have added the aotoselect.js for a textbox you will get a property named autocomplete
Add a textbox on which yo wish to apply autosuggest and write
the script. My function "GetAllSearchProducts" is getting all the
products beginning with the letter typed in the textbox named
"searchproduct"
<div>
<input name="" type="text" class="txtF ui-autocomplete-input" id="searchproduct"
align="absmiddle" /><input name="" type="button" class="btimg" align="absmiddle"
onclick="SearchProduct();" /></div>
<script type="text/javascript">
$(function () {
$("#searchproduct").autocomplete({
source: function (request, response) {
$.ajax({
url: "../Common/GetAllSearchProducts",
data: "{ 'name': '" + request.term + "' }",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
dataFilter: function (data) { return data; },
success: function (data) {
if (data != '') {
response($.map(data, function (item) {
return {
value: item.Name,
text: item.Id
};
}));
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
}
});
},
select: function (event, ui) {
$(':hidden[id=hdnmedicineid]').val(ui.item.text.toString());
$(':hidden[id=hdnmedicinenm]').val(ui.item.value.toString());
},
minLength: 1,
autoFocus: true
});
});
</script>
public JsonResult GetAllSearchProducts(string name = "")
{
var products = _productService.GetAllProducts(name).ToList();
var result = from m in products
select new { m.Id, m.Name };
return Json(result.ToList(), JsonRequestBehavior.AllowGet);
}
Points of Interest
Found it simple and easy to use.