transport.signalr - API Reference - Kendo UI DataSource

transport.signalr `Object`

The configuration used when type is set to "signalr". Configures the SignalR settings - hub, connection promise, server, and client hub methods.

A live demo is available at demos.telerik.com/kendo-ui.

It is recommended to get familiar with the SignalR JavaScript API.

Example

<script src="https://cdnjs.cloudflare.com/ajax/libs/signalr.js/2.4.3/jquery.signalR.min.js"></script>
<script>
    var hubUrl = "https://demos.telerik.com/kendo-ui/service/signalr/hubs";
    var connection = $.hubConnection(hubUrl, { useDefaultPath: false});
    var hub = connection.createHubProxy("productHub");
    var hubStart = connection.start({ jsonp: true });

    var dataSource = new kendo.data.DataSource({
        type: "signalr",
        schema: {
            model: {
                id: "ID",
                fields: {
                    "ID": { editable: false, nullable: true },
                    "CreatedAt": { type: "date" },
                    "UnitPrice": { type: "number" }
                }
            }
        },
        transport: {
            signalr: {
                promise: hubStart,
                hub: hub,
                server: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                },
                client: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                }
            }
        }
    });

    dataSource.fetch(function() {
      /* The result can be observed in the DevTools(F12) console of the browser. */
      console.log(dataSource.data());
    });
</script>

Configuration with ASP.NET Core SignalR:

Example

<script src="https://unpkg.com/@aspnet/signalr@1.0.0/dist/browser/signalr.js"></script>
<script>
    var hubUrl = "https://demos.telerik.com/aspnet-core/service/signalr/hubs/products";

    var hub = new signalR.HubConnectionBuilder()
        .withUrl(hubUrl, {
            transport: signalR.HttpTransportType.LongPolling
        })
        .build();

    var hubStart = hub.start()

    var dataSource = new kendo.data.DataSource({
        type: "signalr",
        schema: {
            model: {
                id: "ID",
                fields: {
                    "ID": { editable: false, nullable: true },
                    "CreatedAt": { type: "date" },
                    "UnitPrice": { type: "number" }
                }
            }
        },
        transport: {
            signalr: {
                promise: hubStart,
                hub: hub,
                server: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                },
                client: {
                    read: "read",
                    update: "update",
                    destroy: "destroy",
                    create: "create"
                }
            }
        }
    });
</script>