The Problem:
You’re tooling along, using the jQuery library to write some great search feature, and you write some great Linq to Sql code. Being an awesome coder your use the extension method syntax. Your action result (in the appropriate controller) looks like this
public ActionResult QuickSearch(string term)
{
var lst = context.Contacts.Select(xx => new {FullName= xx.FirstName +” ” + xx.LastName }).Where(xx => xx.label.ToUpper().Contains(term.ToUpper())).ToList();
return Json(lst,JsonRequestBehavior.AllowGet);
}
And for no good reason, you get no results when you try to search for a contact. All you get is a blank drop down. Why has jQuery UI failed you? Why must javascript code always be so finicky?
The Cause:
For good reason Jquery UI Autocomplete uses JSon for remote data. It looks for a predefined format, and it wants that name to be called “label”. It is case sensitive.
The Solution:
Just change your ActionResult to look like this
public ActionResult QuickSearch(string term)
{
var lst = context.Contacts.Select(xx => new {label= xx.FirstName +” ” + xx.LastName }).Where(xx => xx.label.ToUpper().Contains(term.ToUpper())).ToList();
return Json(lst,JsonRequestBehavior.AllowGet);
}
and you will be golden. Please note I changed FullName to label. Jquery UI Autocomplete is a very nice and useful tool, but it demands to work on it’s own terms. Beyond that I have never had a problem with this wonderful bit of ajax goodness.
|
Written By Steve French |
Leave a Reply