Geek Answers Handbook

JQuery Ajax message not passing parameters

I am trying to use the jQuery $ .ajax () function to send form variables to an MVC route. The problem is that when the code gets into my MVC action, all parameters are zero, even if the data is passed to them:

JQuery

$(function () {
    $('#signupform').submit(function (e) {
        e.preventDefault();

        if ($(this).valid()) {
            var postData = '{name : "' + $("#Name").val() + '", email : "' + $("#Email").val() + '", message : "' + $("#Message").val() + '" }';

            $.ajax({
                url: "/api/contact-form-post",
                data: postData,
                type: "get"
            })
            .complete(function (data) {
                $("#formContainer").html($("#formThankYou").html());
            });
        }
    });
});

the causing warning (postData) displays the following:

{name : "Scott Smith", email : "scott@smith.com", message : "test message" }

MVC action:

public JsonResult ContactFormPost(string email, string name = "" , string message = "")
        {
            AddEmailToMailingList(email);

            if (!String.IsNullOrEmpty(name) && !String.IsNullOrEmpty(message))
            {
                InsertContactMessage(email, name, message);
            }

            return Json(true);
        }

Using FireBug to validate the request shows that this is the URL that is being called. Obviously the URL parameters are not in the correct format, but I cannot understand why.

http: // localhost: 10637 / api / contact-form-post ? {name% 20:% 20% 22Scott% 20Smith% 22,% 20email% 20:% 20% 22scott @ smith.com% 22% 20message% 20:% 20% 22Test% 20message% 22% 20}

- , , ContactFormPost ?

+5
4

postData, $.ajax JS.

var postData = {
    name: $("#Name").val(),
    email: $("#Email").val(),
    message: $("#Message").val()
};
+12

, . ASP.NET AJAX, , JSON.

, return GET, :

return Json(true, JsonRequestBehavior.AllowGet);
+3

, JSON, POST, GET.

+3

, , , , -.

URL-, -, .

, ...

$.ajax({
    ...
    url: 'foo',
    dataType: 'json',
    type: 'POST',
    ...
});

, , , . , ajax.:

$.ajax({
    ...
    url: 'foo/',  // note the trailing slash
    dataType: 'json',
    type: 'POST',
    ...
});

: , JS. . null :

<form action="foo" method="POST">
    <input type="text" name="pleaseDontBeNull" value="swearImNotNull"/>
</form>

:

<form action="foo/" method="POST">  <!-- note the trailing slash -->
    <input type="text" name="pleaseDontBeNull" value="swearImNotNull"/>
</form>
+3

More articles:


All Articles