使用jQuery和AJAX将数据发布到C＃

Question

I have a website where I have built a form. After validation I want to send the data from the inputs to a method in the code behind via AJAX. I have searched extensively and I really have no idea why it's not working.

Here is my JavaScript/Jquery

$('#submitForm').click(function() {

    var userEmail = $(this).children('.user_email').val();
    var userName = $(this).children('.user_name').val();
    var userSubject = $(this).children('.user_subject').val();
    var userMessage = $(this).children('.user_message').val();

    var dataValues = {
        'name': userName,
        'email': userEmail,
        'subject': userSubject,
        'message': userMessage
    }

    dataValues = JSON.stringify(dataValues);

    $.ajax({
        type: "POST",
        url: "Contact.aspx/sendForm",
        data: dataValues,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            alert("it worked!");
        }
    });                    
});

This is my code behind where I attempt to just return a simple string to see if all the values were passed:

[WebMethod]
    public static String sendForm(string name, string email, string subject, string message)
    {
        return DateTime.Now.ToString();
    }

Any help would be appreciated. I've been working for a few hours and can't figure out my problem.

Answer 1

you shall add $(document).ready() before use JQuery, here is the doc

this is my code modified from yours, it works

$(document).ready(function () {
        $('#submitForm').click(function () {

            var userEmail = "email";
            var userName = "userName";
            var userSubject = "UserSubject";
            var userMessage = "UserMesssage";

            var dataValues = {
                'name': userName,
                'email': userEmail,
                'subject': userSubject,
                'message': userMessage
            };

            dataValues = JSON.stringify(dataValues);

            $.ajax({
                type: "POST",
                url: "WebForm2.aspx/sendForm",
                data: dataValues,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {

                    alert("it worked!" + msg.d);
                }
            });
        });
    });

Answer 2

Your contentType: "application/json; charset=utf-8" is expecting json , but in C# you are returning string in the function. You should return json

Here change your code behind function as follows:

[WebMethod]
public static String sendForm(string name, string email, string subject, string message)
{
    var mydatedata = DateTime.Now.ToString();
    return JSON.stringify({ mydate: mydatedata});
}