MVC controller function failed calling from AJAX

Question

I got a problem - I calling cotroller function from ajax, alert is showing but it not even going into controller function.

How could I solve this problem?

Here's my ajax function

   $('#save').on('click', function() {
                if (validateForm("intro2d") && validateForm("intro3d") && validateForm("text_cs")) {
                    intro_data = {
                        projectId: "@Session["projectId"]",
                        Image3d: "", Text3d: document.getElementById("intro3d").value,
                        Image2d: "", Text2d: document.getElementById("intro2d").value,
                        ImageCs: "", TextCs: document.getElementById("text_cs").value
                    };
                    var _intro = JSON.stringify(intro_data);
                    $.ajax({
                        type: "POST",
                      //  async: false,
                        url: 'Introduction/SetIntroductionData',
                        data: {
                            projectName:"@Session["projectName"]",
                            intro: _intro
                        },  
                        success: function (){
                            alert("success");
                        },
                    });
                }
            });

Heres the controller:

[HttpPost]
public ActionResult SetIntroductionData(string projectName, Intro intro){
            using (ISession session = NHibernateHelper.OpenSession()){
                    var exists = session.Query<Intro>().SingleOrDefault(x => x.Project.Id == intro.Project.Id);
                    if (exists != null){
                        return Json("exist");
                    }
                    session.Save(intro);
                    //  return Redirect(Url.Action("Index", "Data", new { projectId = project.Id }));
                    return Json("success");
            }
        }

Answer 1

Always use Url.Action helper method to generate url so that there is no chance of Url mistake.

do like this:

 $.ajax({
                        type: "POST",
                      //  async: false,
                        url: '@Url.Action("SetIntroductionData","Introduction")',
                        data: {
                            projectName:'@Session["projectName"]',
                            intro: _intro
                        },  
                        success: function (){
                            alert("success");
                        },
                    });

Answer 2

Also you may use fiddler or dev tool to check what's happening there and see the response from server. Sometimes even when error occur you may see code 200 but in response text there will be a description of error. I suspect that you need to set explicitly contentType: "application/json; charset=utf-8", so that server is instructed with content type and asp.net will correctly resolve matching controller's action and its paramaters

Answer 3

IMO it must be failing in model binding (converting your _intro into Server's Intro class object). You can confirm that by specifying a simple string parameter both at client side and on server action.

Once that is confirmed, either you can drill down to which field server is unable to map or I would just write a custom model binder. Please check below link to know more about model binding:

6 Tips for ASP.NET MVC Model Binding

Also follow advise given by @Borys Generalov, you could find what's exact issue is when hitting the url in browser itself. I use Chorme browser, press F12, go to Network tab, refresh the page, select the url, than click on Response tab on right hand side panel. It will give you details of what has been returned by server.

Answer 4

You should try changing your url and data values to:

url: '../Introduction/SetIntroductionData',
data: 'projectName=' + projectName + '&intro='+ _intro,