ajax function not returning data in C#

Question

I am trying to create cross domain ajax script but I am little struggling as to why the ajax function is outputting undefined in the table id, instead of correct dynamic data.

    $(document).ready(function () {
    $.support.cors = true;
    $.ajax({
        type: "Post",
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        url: "http://localhost:27335/test2.aspx/BindDatatable",
        data: "{}",
        dataType: "json",
        success: function (data) {
            console.log(data)
            for (var i = 0; i < data.d.length; i++) {
                $("#tbDetails").append("<tr><td>" + data.d[i].Name+ "</td><td>" + data.d[i].Loan + "</td><td>" + data.d[i].Evnt + "</td></tr>");
            }
        },
        error: function (result) {
            alert("Error");
        }
    });
});

Thanks in advance for any assistance.

_in the table id_ what ID are we talking about? and what's the output of `console.log(data)` — lshettyl, Mar 19 '15 at 10:03
Have you debugged it using Firebug to see what (if anything) is being returned from the ajax request? — markpsmith, Mar 19 '15 at 10:04
I have debugged it in Firebug many times, but I am unable to see the data parameter in the response header of the ajax call. I tried changing the `datatype:jsonp`, but this returns null data -(but the request is 200 response). — user3070072, Mar 19 '15 at 10:15
What do you see when you load the URL directly in the browser? — lshettyl, Mar 19 '15 at 10:18
I have attached my current output in my original post, also including the additional code in my server side, for further reference. Thank you for any further assistance. — user3070072, Mar 19 '15 at 10:23
This is the table id, i am passing the ajax function into ``. thanks — user3070072, Mar 19 '15 at 10:24
apology for the late reply. There are currently no errors or data shown in the console log (chrome firebug). Thanks — user3070072, Mar 19 '15 at 11:06

score 2 · Accepted Answer · edited May 23 '17 at 12:12

Follow below steps

1.Debug your method BindDatatable()

2.In return serializer.Serialize(details); You got any result or not ?

If yes then write below line in your code.

if not then serialized with different serializer e.g. Newtonsoft. you can found more details here Convert JSON String To C# Object

$(document).ready(function () {
    $.support.cors = true;
    $.ajax({
        type: "Post",
        crossDomain: true,
        contentType: "application/json; charset=utf-8",
        url: "http://localhost:27335/test2.aspx/BindDatatable",
        data: "{}",
        dataType: "json",
        success: function (data) {
            alert(data.toSource()) ; 
            console.log(data);
            for (var i = 0; i < data.d.length; i++) {
                $("#tbDetails").append("<tr><td>" + data.d[i].Name+ "</td><td>" + data.d[i].Loan + "</td><td>" + data.d[i].Evnt + "</td></tr>");
            }
        },
        error: function (result) {
            alert("Error");
        }
    });
});

This line alert(data.toSource())

IF you got any json then verify your json in jsonlint.com. if it is verified then make sure it is valid as per requirements and also parse.

var parsedData = $.parseJSON(data);

It will work.

Thank you very much for thorough explanation. my server code is returning data, but the json data format in jsonlint is failing the output string. So, I am currently figuring this out. Thanks. — user3070072, Mar 19 '15 at 14:29
always welcome. Jsonlint is your validator of json and it is very helpful. — MSTdev, Mar 20 '15 at 07:02

score 1 · Answer 2 · answered Mar 19 '15 at 11:58

You Webmethod BindDatatable() is returning you a JSON formatted data. You need to parse it before using.

You can do it like as below:

Your Ajax post would be like:

$.ajax({
    type: "Post",
    crossDomain: true,
    contentType: "application/json; charset=utf-8",
    url: "http://localhost:27335/test2.aspx/BindDatatable",
    data: "{}",
    dataType: "json",
    success: function (data) {
        console.log(data)
        var parsedData=$.parseJSON(data);
        for (var i = 0; i < parsedData.d.length; i++) {
            $("#tbDetails").append("<tr><td>" + parsedData.d[i].Name+ "</td><td>" + parsedData.d[i].Loan + "</td><td>" + parsedData.d[i].Evnt + "</td></tr>");
        }
    },
    error: function (result) {
        alert("Error");
    }
});

Here I have made use on parsedData. Instead of the data. You can have a look..

Hope this helps!!

ajax function not returning data in C#

2 Answers2