How to use JayData as the DataSource instead of JSON data?
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
<script type="text/javascript" src="scripts/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="scripts/jaydata.js"></script> <script type="text/javascript" src="scripts/jsrender.min.js"></script>
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> |
