ePezhman
ePezhman

Reputation: 4010

Sending Param to the Ajax of jQuery not effective

I'm trying to use Ajax of jQuery, I have this code below and although I get no error in firebug it's not working, It seems the function in code behind doesn't get any params.

(document).ready(function () {
        $("#S1").click(function 
            () {

            $("#t1").toggle("fast");
            $("#P1").toggle("fast");
            $("#S1").css("background-color", "White");
            var ID = $("#HiddenField1").attr("Value");
            var params = { 'Key': ID };
            $.ajax({
                type: "POST",
                url: "viewMessages.aspx/readen",
                data: params,                    
                dataType: "json"
            });
        });
    });

and here is the code behind

[WebMethod(EnableSession = false)]
public static void  readen(string Key)
{
    DBController db = new DBController();
    db.ReadenMes(Convert.ToInt32(Key));                
}

the code below work but since I wanna use it in IE 6 I have to use the code above.

 $(document).ready(function () {
 $("#S2").click(function 
     () {
     $("#t2").toggle("fast");
     $("#P2").toggle("fast");
     $("#S2").css("background-color","White");
     var ID = $("#HiddenField2").attr("Value");
     var params = new Object();
     params.Key = ID;
     var myJSONText = JSON.stringify(params);
     $.ajax({
         type: "POST",
         url: "viewMessages.aspx/readen",
         data: myJSONText,
         contentType: "application/json",
         dataType: "json"

     });
 });

});

where do you think i'm doing wrong?

Upvotes: 3

Views: 196

Answers (3)

rick schott
rick schott

Reputation: 21117

3 mistakes to avoid when using jQuery with ASP.NET AJAX

$(document).ready(function () {
    $("#S1").click(function 
        () {

        $("#t1").toggle("fast");
        $("#P1").toggle("fast");
        $("#S1").css("background-color", "White");
        var ID = $("#HiddenField1").val();
        var params = "{ 'Key':'" + ID + "'}"; //changes here
        $.ajax({
            type: "POST",
            url: "viewMessages.aspx/readen",
            data: params,                    
            dataType: "json",
            contentType: "application/json; charset=utf-8"
        });
    });
});

Upvotes: 4

scrappedcola
scrappedcola

Reputation: 10572

var ID = $("#HiddenField2").val();
$.ajax({
    type: "POST",
    url: "viewMessages.aspx/readen",
    data: {"KEY":ID},
    contentType: "application/json",
    dataType: "json"

 });

Also you don't need to stringify the data component nor do you need to declare an new Object.

Upvotes: 0

hazzik
hazzik

Reputation: 13344

If your issue only is that IE6 has no JSON.stringify method, than you can use json2.js from Douglas Crockford and then your second sample should work as expected in IE6 too.

$(function () {
  $("#S2").click(function 
     $("#t2").toggle("fast");
     $("#P2").toggle("fast");
     $("#S2").css("background-color","White");
     var ID = $("#HiddenField2").attr("Value");
     var myJSONText = JSON.stringify({ Key: ID });
     $.ajax({
         type: "POST",
         url: "viewMessages.aspx/readen",
         data: myJSONText,
         contentType: "application/json",
         dataType: "json"
     });
  });
});

Another approach is do not use 'json' datatype, and then params should be serialized as regular query string.

$(function () {
  $("#S2").click(function 
     $("#t2").toggle("fast");
     $("#P2").toggle("fast");
     $("#S2").css("background-color","White");
     var ID = $("#HiddenField2").attr("Value");
     var params = { Key: ID };
     $.post("viewMessages.aspx/readen", params);
  });
});

Upvotes: 1

Related Questions