Ajax Request issue with ASP.NET MVC 4 Area

Question

Today i discovered something weird, i have regular asp.net mvc 4 project with no such ajax (just post, get). so today i need ajax request, i did an ajax action with jquery in controller and it didn't work out. Here is my code

Areas/Admin/Controllers/BannersController

    public JsonResult SaveOrder(string model)
    {
        bool result = false;

        if (!string.IsNullOrEmpty(model))
        {
            var list = Newtonsoft.Json.JsonConvert.DeserializeObject<List<int>>(model);

            result = repository.SaveOrder(list);
        }

        return Json(result, JsonRequestBehavior.AllowGet);
    }

View side (Its in area too)

        $(document).ready(function () {
        $("#saveOrder").click(function () {

            var data = JSON.stringify($("#list_banners").nestable('serialize'));

            $.ajax({
                url: '@Url.Action("SaveOrder", "Banners", new { area = "Admin" })',
                data: { model: data },
                success: function (result) {

                    if (result) {
                        toastr.success('Kaydedildi.');
                    }
                    else {
                        toastr.error('kaydedilemedi.');
                    }

                },
                error: function (e) {
                    console.log(e);
                }
            });

        });
    });

i've already tried everything i know, which is $.post, $.get, ajax options, trying request from out of area etc.. just request can't reach action

and here is the errors , http://prntscr.com/297nye

error object http://prntscr.com/297o3x

Answer 1

I had same issue, but after spending too much time, got solution for that. If your request is going to your specified controller, then check your response. There must be some problem in your response. In my case, response was not properly converted to JSON, then i tried with passing some values of response object from controller using select function, and got what i needed.

Answer 2

Try by specifying the data format (json) you wand to post to server like and Also change the way you pass data object in JSON like this :

 var data = $("#list_banners").nestable('serialize');

     $.ajax({
              url: '@Url.Action("SaveOrder", "Banners", new { area = "Admin"    })',
              data: JSON.stringify({ model: data }),
              dataType: 'json',
              contentType: "application/json",
               ...