or
$("#dgGrid").kendoGrid({ groupable: false, sortable: true, editable: "inline", columns: [ { field: "accountId", title: "User #", width: "50px" }, { field: "currentAmt", title: "Amount", width: "100px" }, { command: [{ name: "destroy", template: "<div class='k-button'><span class='k-icon k-delete'></span></div>" }], title: " ", width: 40 } ] });<div id="dgGrid" data-role="grid" style="width:340px; font-size:9px; height:250px" data-bind="source: userAccountsDataSource"> <style type="text/css"> .k-grid tbody .k-button { min-width: 12px; width: 30px; } </style></div>(function (global) { var FlossViewModel, app = global.app = global.app || {}; FlossViewModel = kendo.data.ObservableObject.extend({ acountId: "", accountNick: "", newbcId: "q", userId: "0", checkDate: "", errorMsg: "", accountsVis: true, userAccountsDataSource: "", refreshAccount: function(){ this.populateAccounts(); }, populateAccounts: function(){ var that = this; // kendo.data.ObservableObject.fn.init.apply(that, []); var dataSourceaa = new kendo.data.DataSource({ transport: { read: { type: "GET", dataType: "jsonp", url: '/api/FlossAccount/' }, destroy: { type: "DELETE", url: function (options) { return '/api/FlossAccount/1'; }, dataType: "jsonp", data: {'' : '333'}, //i'm just putting any data for now cache: false }, parameterMap: function (options, operation) { if (operation !== "read" && options.models) { return { models: kendo.stringify(options.models) }; } } }, error: function (e) { that.set("errorMsg", "Error: Check Connection "); dataSourceaa.cancelChanges(); } }); that.set("userAccountsDataSource", dataSourceaa); dataSourceaa.read(); // this.set("userAccountsDataSource", dataSourceaa); }, ..... }); app.flossService = { viewModel: new FlossViewModel() };})(window);[ { type: "foo", count: 6589 }, { type: "bar", count: 2 }, ... more series]<script type="text/javascript"> $(document).ready(function() { $("#chart").kendoChart({ dataSource: { transport: { read: { url: "asat.xml", dataType: "xml" } }, schema: { type: "xml", data: "/cCRMGetForecastByStageResponse/ForecastStages/ForecastStage", model: { fields: { opportunitycount: "opportunitycount/text()", leadscount: "leadscount/text()", description: "description/text()" } } } }, title: { text: "Forecast Count by Stage" }, legend: { position: "top" }, seriesDefaults: { type: "column" }, series: [{ field: opportunitycount, name: "Opportunities" }, { field: leadscount, name: "Leads" }], categoryAxis: { field: "description", labels: { rotation: -90 }, majorGridLines: { visible: false } }, valueAxis: { labels: { format: "N0" }, majorUnit: 1, line: { visible: false } }, tooltip: { visible: true, format: "N0" } }); }); </script><?xml version="1.0"?><cCRMGetForecastByStageResponse xmlns="http://www.pronto.net/crm/1.0"> <ForecastStages> <ForecastStage> <description>Initial Stage</description> <opportunycount>2</opportuny-count> <opportunyamount>1256</opportuny-amount> <leadscount>0</leads-count> <leadsamount>0</leads-amount> </ForecastStage> <ForecastStage/> <ForecastStage> <description>First Stage</description> <opportunitycount>1</opportunitycount> <opportunyamount>100</opportuny-amount> <leadscount>1</leadscount> <leadsamount>80000</leads-amount> </ForecastStage> </ForecastStages></cCRMGetForecastByStageResponse >