We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to use JayData as the DataSource instead of JSON data?

Platform: JavaScript |
Control: ejmGrid |
Published Date: February 16, 2015 |
Last Revised Date: February 17, 2015
Tags: grid, mobile

JayData can also be used as the DataSource instead of JSON. Refer to the JayData sources to do that. JayData is a unified data access library for JavaScript to work with online and offline data APIs like WebSQL, IndexedDB, Facebook, or OData. JayData source can be downloaded by clicking here. After the download, the scripts have to be referred in the HTML page. Refer to the following code example.

HTML

The field for the Grid has to be stored in a separate variable and then the data is stored in the variable by using the .save() method. Refer to the following code example.

Script

<script>

// Fields for the grid data stored to a variable task.

        var Task = $data.define("Task", {

            OrderID: Number,

            CustomerID: String,

            Freight: Number

        });

 // Data for the field in the Grid can be given by using the .save() method.

        Task.save({

            OrderID: 123,

            CustomerID: 'BAS3000',

            Freight: 20

        });

</script>

Then the data can be initialized in the Grid control by means of the .readall() method in the JayData that renders the data in the Grid.

Script

<script>

Task.readAll().then(function (orderdetails) {

            $("#mobgrid").ejmGrid({

                dataSource: orderdetails,

                allowScrolling: true,

                allowPaging: true,

                columns: [

                         { field: "OrderID", headerText: "Order ID" },

                         { field: "CustomerID", headerText: "Customer ID" },

                         { field: "Freight", headerText: "Freight" }

                ]

            });

        });

    </script>

 
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.