Ajax call not working

Question

I am making an ajax call to C# function but it is not being call.

This is ajax call:

$('#button1 button').click(function () {
    var username = "username_declared";
    var firstname = "firstname_declared";
    $.ajax({
        type: "GET",
        url: "practiced_final.aspx/ServerSideMethod",
        data:{username1:username,firstname1:firstname},
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            $('#myDiv').text(msg.d);
        },
        error: function (a, b, c) {
            alert(a + b + c);
        }
    });
    return false;
});

This is C# code:

[WebMethod]
public static string ServerSideMethod(string username1, string firstname1)
{
    return "Message from server with parameter." + username1 + "hello" + firstname1;
}

This method is not getting hit and shows a error message like this:

object XMLHttpRequest]parsererrorundefined

Any help will be highly appreciated.

Answer 1

$('#button1 button').live('click', function () {
            var username = "username_declared";
            var firstname = "firstname_declared";
            $.ajax({
                url: "/practiced_final.aspx/ServerSideMethod", type: "GET", dataType: "json",
                data: JSON.stringify({ username1: username, firstname1: firstname }),
                contentType: "application/json; charset=utf-8",
                success: function (msg) {
                    $('#myDiv').text(msg.d);
                },
                error: function (a, b, c) {
                    alert(a + b + c);
                }
            });
        });

$('button#button1') or $('#button1') or $('#button1 button') check u selector also. put one alert message inside click event and see

Answer 2

Finally it is working.This is the final code. Thanks everyone for your wise replies.

                $.ajax({
                 type: "POST",
                 url: "practiced_final.aspx/hello_print",
                 data: "{}",
                 contentType: "application/json; charset=utf-8",
                 dataType: "json",
                 async: true,
                 cache: false,
                 success: function (msg) {
                 $('#myDiv').text(msg.d);
                 }
                 })
                 return false;

Enjoy.

Answer 3

Try changing this line:

data:{username1:username,firstname1:firstname},

to

data:JSON.stringify({username1:username,firstname1:firstname}),

Edit:

I'm not sure if this is the cause of the problem, but this is one thing I noticed different between our jQuery ajax calls. Also, changed result string to reflect @dana's criticism in the comments of my answer.

Answer 4

In your code I can see : dataType: "json",

But you're not sending a Json through your C# function... When you're telling ajax that the dataType is a json, it will JSON.parse() the response. Maybe that's where the failure is. Try changing the dataType, or removing it (jQuery will try to guess it).

Answer 5

  $('button#button1') //Or check selector put one alert inside onclick
  $('#button1').live('click', function () {
                var username = "username_declared";
                var firstname = "firstname_declared";
                $.ajax({
                    type: "GET",
                    url: "practiced_final.aspx/ServerSideMethod",
                    data: JSON.stringify({ username1: username, firstname1: firstname }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (msg) {
                    $('#myDiv').text(msg.d);
                    },
                    error: function (a, b, c) {
                        alert(a + b + c);
                    }
                    })
                    return false;

it may help

Answer 6

Please Change below line in Jquery function.

data:{username1:username,firstname1:firstname},

to

data:"{'username1':'" + username + "','firstname1':'" + firstname + "'}",

Hope this will help you.