Question

I have a jQuery autoselect box displaying the correct data. Now I would like to fire an ASP.NET MVC 3 controller when an item is selected. The controller should then redirect to a View. Here’s my jQuery autocomplete code (I’m sure something is missing in the 2nd Ajax call, but I haven’t found it yet):

<script type="text/javascript">
    $(function () {
        $("#Client").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: 'Entity/GetClientAutoComplete', type: 'POST', dataType: 'json',
                    data: { query: request.term },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return { label: item, value: item };
                        }))
                    }
                })
            },
            minLength: 1,
            select: function (event, ui) {
                $.ajax({
                    url: 'Entity/GetApplicationsByName/' + ui.item.value, type: 'POST'
                })
            }
        });
    });
    </script>

And here’s the controller I’m trying to call:

 public ActionResult GetApplicationsByName(string id)
        {
            ViewBag.Client = id;
            var apps = _service.GetDashboardByName(id);
            return View("Dashboard", apps.ToList());
        }

When I watch the Ajax call fire in Firebug, I see the correct URL configuration, but nothing else happens. It’s acting as though it wants to load something rather than send something. I’m confused. Thank you for any guidance.

Answer 1

Well you sent an id by POST to the GetApplicationsByName controller and the controller is sending back the view.

If you want redirection, you can use the following:

select: function (event, ui) {
    window.location.href = 'Entity/GetApplicationsByName/' + ui.item.value;
}