jQuery Autocomplete tied to WCF Service ASP.NET MVC

Question

New to ASP.NET MVC and programming, and I have searched high and low for materials on this subject but haven't found a concrete answer for my particular problem.

The project I am working on requires the use of WCF services. Initially I started with a jQuery autocomplete function that worked, however moving the code to a WCF service has broken some communication. The autocomplete functionality no longer works

WCF Service

public IList<Location> QuickSearchLocation(string term)
    {
        using (var db = new InspectionEntities())
        {
            //return all locations except the reserved "Other"
            return db.Locations
                .Where(r => r.LocationName.Contains(term) && r.LocationId !=    Constants.OtherId)
                .ToList();
        }
    }

The above code is meant to takes user input based on relation to child table. If user input does not match data in child table, the users entry is saved to an "other" column in the main db.

Controller

public ActionResult QuickSearchLocation(string term)
    {
        return Json(_service.QuickSearchLocation(term), JsonRequestBehavior.AllowGet);
    }

View

div class="editor-field">
        @Html.TextBoxFor(m=>m.LocationId,new {data_autocomplete =     Url.Action("QuickSearchLocation", "Inspection")})

script

$(document).ready(function () {

$(":input[data-autocomplete]").each(function () {

    $(this).autocomplete({ source: $(this).attr("data-autocomplete")});
});

Any insight on my problem would be helpful.

Please, stop referring to "ASP.NET MVC" simply as "MVC". One is a framework, while other is a language-independent design pattern. It is like you kept on using name "the internet" when talking about IE. — tereško
– tereško, Commented Nov 2, 2012 at 14:16

Ivan Ferić · Accepted Answer · 2012-11-02 14:35:17Z

1

Autocomplete expects either only labels or labels with values. On the other hand, you're serving it the whole Location object.

You should therefore, create a helper class:

public class AutocompleteLocation{
    public AutocompleteLocation(Location location){
        label = location.LocationName;
        value = location.LocationId;
    }
    public string label {get;set;}
    public string value {get;set;}
}

After this, you should change your QuickSearchLocation controller method like this:

public ActionResult QuickSearchLocation(string term)
{
    return Json(_service.QuickSearchLocation(term).Select(l => new AutocompleteLocation(l)).ToList(), JsonRequestBehavior.AllowGet);
}

You should also consider not returning all the results but, rather, only first few (10 for example).

answered Nov 2, 2012 at 14:35

Ivan Ferić

4,76311 gold badges40 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

WiseGuy Over a year ago

Thanks man the autocomplete is back up, will definitely need to start looking into those helper classes.

Collectives™ on Stack Overflow

jQuery Autocomplete tied to WCF Service ASP.NET MVC

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related