Extra param from jquery autocomplete to mvc controller

Question

I require some help with my JQuery autocomplete. Im trying to autocomplete postalcodes filtered by countries but for this I need to send a country value along with the autocomplete term to my mvc controller.

The value of the var country should be send as an extra param towards the controller action but I can't seem to accomplish this.

Here is my setup without the extra param:

View:

@Html.TextBoxFor(j => j.MainAddressCountry, new { data_autocomplete_url = Url.Action("AutoCompletePostalCode", "Location")})

script:

var country = $("#MainAddressCountry");

$('*[data-autocomplete-url]')
    .each(function() {
        $(this).autocomplete({
            source: $(this).data("autocomplete-url"),
            messages: {
                noResults: '',
                results: function() {
                }
            },
            focus: function() {
                var menu = $(this).data("uiAutocomplete").menu.element;
                var focused = menu.find("li:has(a.ui-state-focus)");
                if (menu.parent().hasClass('scroll-wrapper')) {
                    setTimeout(function() {
                        var height = menu.parent().height();
                        if (focused.position().top + focused.height() > height) {
                            menu.scrollTop(menu.scrollTop() + parseInt(focused.position().top) + focused.height() - height);
                        }
                    }, 1);
                }
            },
            "open": function() {
                var menu = $(this).data("uiAutocomplete").menu.element;
                menu.addClass('scrollbar-dynamic').addClass('autocomplete-scroll');
            }
        });
    }
);

controller:

public ActionResult AutoCompletePostalCode(string term)
    {
        var items = new[] {"2220", "2222", "1800", "1900", "3541", "5214", "9000", "9002", "9006"};

        var filteredItems = items.Where(
            item => item.IndexOf(term, StringComparison.InvariantCultureIgnoreCase) >= 0
            );
        return Json(filteredItems, JsonRequestBehavior.AllowGet);
    }

Anyone that might know how to do the trick?
Thanks in advance.

what jquery autocomplete plugin ? jqueryui autocomplete?

Cosmin
– Cosmin

2015-02-20 13:59:42 +00:00
Commented Feb 20, 2015 at 13:59 — Cosmin
– Cosmin, Commented Feb 20, 2015 at 13:59
@Kosmo yes, that one

Filip Huysmans
– Filip Huysmans

2015-02-20 14:09:46 +00:00
Commented Feb 20, 2015 at 14:09 — Filip Huysmans
– Filip Huysmans, Commented Feb 20, 2015 at 14:09

Cosmin · Accepted Answer · 2015-02-20 14:28:08Z

1

You need to change the way you build source property into something like this:

 source: function(request, response) {
    $.getJSON("url here", { parameter1: 'your first parameter', parameter2: 'your second parameter' }, 
              response);
  },

Controller action:

public JsonResult Test(string parameter1, string parameter2)
{
 //code
}

edited Feb 20, 2015 at 14:28

answered Feb 20, 2015 at 14:12

Cosmin

2,2141 gold badge23 silver badges39 bronze badges

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

5 Comments

Filip Huysmans Over a year ago

And how do I access those parameters in the Controller action?

Cosmin Over a year ago

Your controller action must have parameters with the same name. So if you send parameter1 :'something' and parameter2 :'something else' than your action should have 2 parameters named parameter1 and parameter2. They will be automatically mapped. I've updated my answer

Filip Huysmans Over a year ago

I've implemented your changes but the url to the controller is different with your approach. Normally it should be "http://*****/api/sitecore/Location/AutoCompleteCountry?term=b" and with your implementation it becomes: "http://*****/en/register/company?parameter1=Belgium&parameter2=2220". Now it does not map to the controller action. Any idea why this happens?

Cosmin Over a year ago

As I said.. change the name of parameters in your controller action.. if you send parameter1 than you need to have a parameter named parameter1 in your controller. If you send term, then you need a parameter named term in your controller action

Filip Huysmans Over a year ago

this has nothing to do with the parameters, this is the url linking towards the controller that is totally different for some reason

Collectives™ on Stack Overflow

Extra param from jquery autocomplete to mvc controller

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related