E
egarcia
Guest
Kendo UI Builder generates code to instantiate Kendo UI DataSources using the JSDO dialect. The code is generated into the controller.js file. When working with a view created from a built-in template, Kendo UI Builder generates code for the data sources used in the view. When working with a view created from a blank template, Kendo UI Builder generates data sources for all the data sources specified in the view's properties. You can refer to the Kendo UI DataSources from the controller.public.js file. For example, for a view created using the blank template, you would use this.$ds[' ).done( ).fail( ); Example: try { this.$ds['OrderOrderLineDS'].transport.jsdo .invoke('MonthlySales', {piYear: 2017, pcSalesRep: 'BBB'}) .done(function (jsdo, success, request) { console.log('Monthly Sales for ' + request.objParam.pcSalesRep + ': '); if (request.response.ttSales) { request.response.ttSales.ttSales.forEach(function (element) { console.log(element.Month + ' ' + element.Sales); }); } }).fail(function (jsdo, success, request) { console.log('Error while calling invoke operation.'); }); } catch (e) { console.log('Exception: ' + e.message); } Note: This example uses the following demo service: Service URI: http://oemobiledemo.progress.com/OEMobileDemoServices Catalog URI: http://oemobiledemo.progress.com/OEMobileDemoServices/static/SportsService.json Resource: OrderOrderLine In some cases, depending on your requirements, you might want to create JSDOs or DataSources programmatically. For example, you need to call an invoke operation or dynamically change the DataSource for Grid or a Chart. Here are some scenarios: Creating a JSDO instance and calling a JSDO API method such as invoke(). Creating a Kendo UI DataSource of type JSDO. Creating a Kendo UI DataSource of type JSDO using an existing JSDO instance. In this case, you would be sharing a JSDO instance instead of creating a new one internally. The JSDO instance can be shared with multiple DataSources. Creating a Kendo UI DataSource with local data. Creating a JSDO instance and calling a JSDO API method such as invoke() jsdo = new progress.data.JSDO('OrderOrderLine'); jsdo.invoke(' ).done( ).fail( ); Example: var jsdo; try { jsdo = new progress.data.JSDO('OrderOrderLine'); jsdo .invoke('MonthlySales', {piYear: 2017, pcSalesRep: 'BBB'}) .done(function (jsdo, success, request) { console.log('Monthly Sales for ' + request.objParam.pcSalesRep + ': '); if (request.response.ttSales) { request.response.ttSales.ttSales.forEach(function (element) { console.log(element.Month + ' ' + element.Sales); }); } }).fail(function (jsdo, success, request) { console.log('Error while calling invoke operation.'); }); } catch (e) { console.log('Exception: ' + e.message); } Creating a Kendo UI DataSource of type JSDO dataSource = new kendo.data.DataSource({ type: 'jsdo', transport: { jsdo: 'OrderOrderLine', tableRef: 'ttOrder' } }); Creating a Kendo UI DataSource of type JSDO using an existing JSDO instance jsdoInstance = new progress.data.JSDO('OrderOrderLine'); orderDS = new kendo.data.DataSource({ type: 'jsdo', transport: { jsdo: jsdoInstance, tableRef: 'ttOrder' } }); orderLineDS = new kendo.data.DataSource({ type: 'jsdo', transport: { jsdo: jsdoInstance, tableRef: 'ttOrderLine' } }); Creating a Kendo UI DataSource with local data dataSource = new kendo.data.DataSource({ data: [ { name: "Jane Doe", age: 30 }, { name: "John Doe", age: 33 } ] }); Related links: Documentation for the JSDO: documentation.progress.com/output/pdo/index.html#page/pdo%2Fjsdo-overview.html Documentation for he Kendo UI DataSource: https://docs.telerik.com/kendo-ui/api/javascript/data/datasource Sample app that creates local DataSources: https://github.com/CloudDataObject/kendo-ui-builder-samples/tree/develop/charts https://github.com/CloudDataObject/kendo-ui-builder-samples/blob/develop/charts/app/src/modules/charts/charts-demo/controller.public.js
Continue reading...
Continue reading...