Question

In my html I have

<h2>Title goes here</h2>

    @using (Html.BeginForm("Action", "Controller", FormMethod.Post, new { id = "myFormID" })) {
        <input type="text" id="testinput" name="testinput" />
        <input type="text" id="testinput2" name="testinput2" />

        <input type="button" value="click me" onclick="submitForm();" />
    }

in my js I have

function submitForm() { 

    dataString = $("#myFormID").serialize();

    alert(dataString);

    $.ajax({

        type: "POST",
        url: "/Controller/Action",
        data: dataString,
        cache: false,
        dataType: "json",

        success: function (data) {

            alert('success!');
        },

        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert(XMLHttpRequest + "<br />" + textStatus + "<br />" + errorThrown);

        }

    }); 

}

In my controller file I have:

    public ActionResult Action()
    {
        return View();
    }



    [HttpPost]
    public ActionResult Action(string testinput, string testinput2)
    {
        return View();
    }

When clicked on “click me” button, I get the following error:
“parsererror
Invalid JSON: “

What am I doing wrong? I am simply trying to pass form data to jquery .ajax.

The alert statement outpust “testinput=gdfgf&testinput2=gfgfd” which is the correct values I entered. SO the error seems to be when serializing….
I am using MVC 3 with razor…I had the impression that passing data between model/view and javascript code was made easier.

Answer 1

I am almost positive that has nothing to do with the data you pass to the $.ajax call and everything with the data returned by /Controller/Action. Open up Fiddler and examine the response. it is likely malformed (or not JSON at all).