IE 9 issue with dataSource

[Dan]

Hi there,

I am trying to replace the datasource based on some time interval.  The data grid original datasource should be replaced with the new data source coming from the server.  I found some documentation saying to use the following method will do what I need.

However, this method is not working in IE 9.  It works in IE 8 and IE 10.

$("#dashboardGrid").ejGrid("dataSource", newItems);

When ever this is called in IE 9, I am getting the following script error:

javascript runtime error: DataManager - executeLocal() : Json data is required to execute.

undefined.

There's no issue with IE 8 or IE 10.  Just when running in IE 9.

I have also attached the error.

Attachment: IE9_Error_18fe459b.rar

[Alan Sangeeth S]

Hi Dan,

 

Thanks for using Syncfusion Products.

 

We regret to let you know that we are unable to reproduce the issue in our end. Based on your requirement we have created a simple sample with the video demonstration of working sample and the same can be downloaded from below link.

 

Sample: http://www.syncfusion.com/downloads/support/directtrac/130427/EJGrid-1161763710.zip

Video: http://www.syncfusion.com/downloads/support/directtrac/130427/datasource-1390367644.zip

 

Could you please replicate the issue in the above sample and send us back or send us more information about the issue so that we could sort out the cause of the issue and provide you a response as early as possible?

 

Regards,
Alan Sangeeth S

[Dan]

Which version of the Syncfusion DLL was used for this sample solution?  

Is it 12.2450.0.36?  This is the version in which I have the issue with.

Thanks,
Danny

[Dan]

Hi Support Team,

I have modified the solution you have included with Web Api and SignalR libraries.

The WebApi calls a method of the SignalR client method which if you check in debug mode on IE 9 returns an array with the data fine.

But once you call this method in IE9:

$("#Grid").ejGrid("dataSource", dataModel);

This will throw that error that I mentioned.  Attached is the modified sample solution.

Please help.

Thanks,

Dan

Attachment: EJGrid_3521f1c7.rar

[Gowthami V]

Hi Dan

Sorry for the inconvenience caused.

 

We have analyzed your issue and we have modified the sample based on your requirement and the same can be downloaded from the below link

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/EJGrid_3521f1c71942730838.zip

For your kind information , for refreshing the grid datasource in ajax success it is necessary to return the json data from the server. So please refer the below code snippet for passing the JsonResult from the server to client.

public JsonResult Post()

        {

            try

            {

                IHubContext hub = GlobalHost.ConnectionManager.GetHubContext("MainHub");

                  //the above line is not necessary because we have passed the json data to the client

                var data = Data();

                return new JsonResult()

                {

                    Data = data,

                    JsonRequestBehavior = JsonRequestBehavior.AllowGet

                };

            }

 

function callSignalR() {

    $.ajax({

        url: "api/SignalRTest",

        contenttype: "application/json",

        dataType: "json",

        type: "POST",

        success: function (e) {

        flag=0;

           $("#Grid").ejGrid("dataSource", e.Data);

        }

    });

}

 

And also we have added the user defined function “RefreshData”  in the MainHub.cs file. Using ActionComplete event of the grid we have refreshed the data in client from the server.

Please refer the below code snippet

MainHub.cs

 

public class MainHub : Microsoft.AspNet.SignalR.Hub

    {

. . . .

. . . .

public void RefreshData(object datamanager)

        {

            Clients.Others.refreshData(datamanager);

        }

    }

 

test.js

 

$(function () {

window.testHub = $.connection.mainHub;

// Client method

window.testHub.client.refreshData = function (dataModel) {

       flag = 1;

       $("#Grid").ejGrid("dataSource", dataModel);

   };

    // Start the connection.

    $.connection.hub.start()

        .done(function () {

          

            window.actionComplete = function (args)

            {

                if (flag == 0) {

                    if (args.requestType == "refresh") {

 

 

                        window.testHub.server.refreshData(args.model.dataSource);

 

                    }

                }

            }

           

 

        })

        .fail(function () {

        });

});

 

Please try the above sample and let us know if you have any queries.

Regards,

Gowthami V.

[Dan]

Hi Syncfusion Support,

I am still getting the same issue in IE 9 with your sample.  What I did was launch the site with Chrome and when the autoComplete event is fired, it will hit the SignalR hub and broadcast to all the other browsers.  I had the IE 9 browser opened and once it the SignalR sends the datasource object and calls the code below, it's happening again.

window.testHub.client.refreshData = function (dataModel) {

        flag = 1;

        $("#Grid").ejGrid("dataSource", dataModel);

    };

I actually when through and debug the ej.web.all.js and found line number 1184 to be the culprit of the issue.  The code: dataSource instanceOf Array is returning false when it's in IE 9.  However, if you check with Object.prototype.toString.call(dataSource) then does say "[object Array]".   After changing this, the code works fine.

The other work around is before sending the object array to the hub, you can stringify the array and do $.parseJson on the stringified array.  

Odd thing is doesn't happen on the ajax JsonResult but only during SignalR sending of the object.

Thanks,

Danny

[Alan Sangeeth S]

Hi Dan,

 

We are able to reproduce the issue in our end and the cause of the issue is we had bound Grid datasource array to the object type parameter of “RefreshData” method in MainHub.cs file in which it returns data as object of object arrays. So as you have mentioned we need to stringify the data before passing it to the hub and then we need to convert the stringified array to json object using parseJSON before passing it to Grid “dataSource” method. Please refer the following code snippets.

 

window.testHub.client.refreshData = function (dataModel) {

       flag = 1;

       $("#Grid").ejGrid("dataSource", $.parseJSON(dataModel));

};

 

window.actionComplete = function (args)

            {

                if (flag == 0) {

                    if (args.requestType == "refresh")

                        window.testHub.server.refreshData(JSON.stringify(args.model.dataSource));

                }

}

 

public void RefreshData(string datamanager)

        {

            Clients.Others.refreshData(datamanager);

}

 

 

Please let us know if you have any queries.

 

Regards,
Alan Sangeeth S

 

[Dan]

I understand that stringify the object will actually work.  But the SignalR server call we have should take in a strong typed object argument.  Using string arguments on our calls means that any other caller of this method will also have to stringify their objects to the SignalR hub.

Also, this issue is not happening on IE 8 or 10, or any other browsers.  It's just on IE 9.  

[Alan Sangeeth S]

Hi Dan,

 

Thanks for the update.

 

We have modified the sample based on your requirement and the same can be downloaded from below link.

Sample: http://www.syncfusion.com/downloads/support/directtrac/130698/EJGrid_3521f1c7409359564.zip

 

In the above sample, instead of passing string value to the server-side, we have used List of Strongly typed Class as argument in SignalR server call and returned serialized data. Please refer the following code snippets.

public void RefreshData(List<EditableOrder> datamanager)

        {

            var serializedData = new System.Web.Script.Serialization.JavaScriptSerializer().Serialize(datamanager);

            Clients.Others.refreshData(serializedData);

        }

 

window.testHub.client.refreshData = function (dataModel) {

       flag = 1;

       $("#Grid").ejGrid("dataSource", $.parseJSON(dataModel));

   };

 

Please let us know if you have any queries.

Regards,
Alan Sangeeth S