Grid not getting populated with ASP.Net Web Service JSON result

[Shiva]

Dear Community,

For last few hours, I have been trying to populate the grid with remote data coming from a ASP.Net web service. The data returned is in JSON format.

But the problem is that grid is not getting populated with the result. In fact, if I open the fiddler, I don't see any corresponding http request to my web service that will fetch the data.

Here is what I have:

$(document).ready(function () {

           $("#grid").kendoGrid({

               dataSource: {

                   type: "json",

                   transport: {

                       read: "http://localhost/WebServices/MyWebService.asmx/GetBBGToADVTransactionsData",

                       contentType: "application/json; charset=utf-8",

                       type: "POST"

                   }

               },

               pageSize: 10,

               serverPaging: true,

               serverFiltering: true,

               serverSorting: true

           });

       });

I in fact, tried fetching data in a variable as well, but even that is not working.

var dataSource = new kendo.data.DataSource({

            transport: {

                read: {

                    // the remote service url

                    url: "http://localhost/WebServices/MyWebService.asmx/GetBBGToADVTransactionsData",

 

                    contentType: "application/json; charset=utf-8",

 

                    type: "POST",

 

                    dataType: "json

                }

            }

        });

Can you please help me, what I'm doing wrong here?

Cheers,
Shiva

[Kyle]

Is your ASP.Net service returning a string or an object?

[Shiva]

It returns a string. Below is the code of my web service.

[WebService(Namespace = "http://tempuri.org/")]

    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

    [System.ComponentModel.ToolboxItem(false)]

    [ScriptService]

    // To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.

    // [System.Web.Script.Services.ScriptService]

    public class MyWebService : System.Web.Services.WebService

    {

        SourceDataServicesSoapClient objService = null;

 

        [WebMethod]

        [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet=true)]

        public string GetBBGToADVTransactionsData()

        {

            try

            {

                string jsonData = string.Empty;

 

                objService = new SourceDataServicesSoapClient();

                CSTMBBGToADVTransaction[] data = objService.GetADVTransactionMasterStaging("ByAsOfDate", "07/27/2011");

 

                jsonData = JsonConvert.SerializeObject(data);

 

                return jsonData;

 

                //return "[{TxnStagingID:4178, AsOfDate:243}]";

            }

            finally

            {

                objService = null;

            }

        }

    }

Please help

[Kyle]

Returning a string could be the cause of your problem. I had the same issue when using ASP.Net. Because you are returning a string, .net will actually encapsulate your json with qotes. So instead of:

[{TxnStagingID:4178, AsOfDate:243}]

Your webservice will be returning:

"[{TxnStagingID:4178, AsOfDate:243}]"

Which is not valid. I found I had to return an actual class.

public class Entity
{
  public int TxnStagingID;
  public int AsOfDate;
}

Because you are specifying type: "json" in your data source, this should let .net know how to properly convert the object to json. (You should also be able to return an IList<Entity>).

Also, I have found it very helpful to use Google Chrome and the 'View Javascript Console'. If you view the network tab, you can see all outgoing requests. This is how I found that my results were coming back with surrounding quotes.

Hope this helps!

[David]

try this

public void GetBBGToADVTransactionsData()

        {

            try

            {

                string jsonData = string.Empty;

  

                objService = new SourceDataServicesSoapClient();

                CSTMBBGToADVTransaction[] data = objService.GetADVTransactionMasterStaging("ByAsOfDate", "07/27/2011");

  

                jsonData = JsonConvert.SerializeObject(data);

                 

                Context.Response.ClearHeaders();

                Context.Response.ClearContent();

                Context.Response.ContentEncoding = System.Text.Encoding.UTF8;

                Context.Response.ContentType = "application/json; charset=utf-8";

                Context.Response.Write(jsonData);

                //return jsonData;

  

                //return "[{TxnStagingID:4178, AsOfDate:243}]";

            }

            finally

            {

                objService = null;

            }

        }

Regards.
David

[Jeremy]

You may be double serializing the results.  Because your ajax call has 

contentType: "application/json; charset=utf-8", 

you should not need to manually serialize the object manually.

see here:
http://encosia.com/asp-net-web-services-mistake-manual-json-serialization/ 

Also, whenever I have the problem where the grid is simple not binding, yet results are being returned, sometimes the problem is elsewhere such as a wrapper function in a column silently blowing up.