KendoUI Grid Signalr Error

Question

I am receiving the error "Maximum call stack size exceeded" while trying to bind Signalr data to the KendoUI grid (v2014.1 416).

Here is my current code:

var epConnection = $.hubConnection();
var hub = epConnection.createHubProxy("EventsPendingHub");
var hubStart = epConnection.start();

$('#tblEventsPending').kendoGrid({
    sortable: true,
    columns: [
        { field: "EventNum" },
        { field: "Area" },
        { field: "Zone" },
        { field: "Priority" },
        { field: "Type" },
        { field: "TIQ" },
        { field: "Location" },
        { field: "Apt"}
    ],
    dataSource: {
        type: "signalr",
        autoSync: true,
        schema: {
            model: {
                id: "EventNum",
                fields: {
                    "EventNum": { type: "string" },
                    "Area": { type: "string" },
                    "Zone": { type: "string" },
                    "Priority": { type: "string" },
                    "Type": { type: "string" },
                    "TIQ": { type: "string" },
                    "Location": { type: "string" },
                    "Apt": {type: "string"}
                }
            }
        },
        sort: [
            { field: "Priority", dir: "desc"},
            { field: "TIQ", dir: "desc"}
        ],
        transport: {
            signalr: {
                promise: hubStart,
                hub: hub,
                server: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                },
                client: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                }
            }
        }
    }
});

Hub Code:

[HubName("EventsPendingHub")]
public class EventsPendingHub : Hub
{
private readonly EventsPending _eventsPending;

public EventsPendingHub() : this(EventsPending.Instance) {}

public EventsPendingHub(EventsPending eventsPending)
{
    _eventsPending = eventsPending;
}

public IEnumerable<EventPending> GetAllEventsPending()
{
    return _eventsPending.GetAllEventsPending();
}
}

Startup.cs:

[assembly: OwinStartup(typeof(CADView.Startup))]
namespace CADView
{
public class Startup
{
    public void Configuration(IAppBuilder app)
    {
        var hubConfiguration = new HubConfiguration();
        hubConfiguration.EnableDetailedErrors = true;

        app.MapSignalR(hubConfiguration);
    }
}
}

The error is being thrown at the client by jQuery...the last line from below is repeated 30+ times.

Uncaught RangeError: Maximum call stack size exceeded

o.extend.isPlainObject jquery-2.1.0.min.js?hash=2258a75c-c461-4821-2436-dfdf3af9bffe:2 o.extend.o.fn.extend jquery-2.1.0.min.js?hash=2258a75c-c461-4821-2436-dfdf3af9bffe:2

Answer 1

I have the similar problem with you and i find out that kendo ui is not compatible with higher version of jQuery. ex:-jquery-2.1.0.min.js

it is compatible with jquery-1.9.1.min.js try this you will get rid of this problem.