or
$(document).ready(function() { var dataSource = new kendo.data.DataSource({ transport: { read: { url: "/api/company/get", dataType: "json" }, destroy: { url: "/api/company/delete", dataType: "json" }, parameterMap: function(options, operation) { if (operation !== "read" && options.models) { return {models: kendo.stringify(options.models[0].id)}; } } }, batch: true, pageSize: 20, schema: { model: { id: "id", fields: { id: { type: "number" }, name: { type: "string" }, admin_id: { type: "number" }, address_id: { type: "number" }, status_msg: { type: "string" } } } } });
}); 01.var grid = $("#gridJobsH");02. 03.grid.kendoGrid({04. dataSource: dataSource05. , columns: [ 06. { field: 'HasSAPAccrualsTop', title: " ", template: '<span class="AccrualStatus-#= HasSAPAccrualsTop #"></span>', width: 50, filterable:false, sortable: false} 07. ,{ field: 'CommitmentCode', title: 'Purchase Order'}08. ,{ field: 'CommitmentSeller', title: 'Subcontractor'} 09. ]10. , sortable: true11. , reorderable: true12. , groupable: false13. , filterable: true14. , columnMenu: true15. , selectable: false16. , pageable: false17. , resizable: true18. , scrollable: {19. virtual: true20. }21. , detailInit: detailInit22. , toolbar: [23. { template: kendo.template($("#gridJobsHToolbarTemplate").html()) }24. ]25.});01.//Detail grid02.function detailInit(e) {03. $('<div class="hdChildGrid"></div>').appendTo(e.detailCell).kendoGrid({04. dataSource: {05. data: gridDetails06. , autoSync: false07. , schema: {08. model: {09. id: "PhaseCode"10. ,fields: { 11. HasSAPAccruals:{ editable: false }12. ,PhaseCode: { editable: false }13. ,Description: { editable: false }14. ,PeriodStart: { editable: true, type: "date" }15. ,PeriodEnd: { editable: true, type: "date" }16. ,CommittedCost: { editable: false }17. ,TotalCostActual: { editable: false }18. ,Accruals: { editable: false }19. ,Incurred: { editable: false, type: "number" }20. ,CurrentSAPValue: { type: "number" }21. ,SAPAccrualValue: { type: "number" }22. }23. }24. }25. , filter: { field: "CommitmentCode", operator: "eq", value: e.data.CommitmentCode }26. }27. , columns: [ 28. { field: 'HasSAPAccruals', title: " ", template: '<span class="AccrualStatus-#= HasSAPAccruals #"></span>', width: 50, filterable:false, sortable: false, locked: true, lockable: false}29. ,{ field: "PhaseCode", title: "Phase Code", width: 150, locked: true, lockable: false }30. ,{ field: "Description", title: "Description", width: 150 }31. ,{ field: "PeriodStart", title: "Period Start", width: 150, format:"{0:MM-dd-yyyy}"}32. ,{ field: "PeriodEnd", title: "Period End", width: 150, format:"{0:MM-dd-yyyy}"}33. ,{ field: "CommittedCost", title: "PO Value", width: 110, type: "number", format: "{0:c}" }34. ,{ field: "TotalCostActual", title: "Expenditures", width: 130, type: "number" , format: "{0:c}"}35. ,{ field: "Accruals", title: "Accruals", width: 100, type: "number" , format: "{0:c}" }36. ,{ field: "Incurred", title: "Incurred", width: 100, format: "{0:c}" }37. ,{ field: "CurrentSAPValue", title: "Current SAP Value", width: 170, format: "{0:c}"}38. ,{ 39. field: "SAPAccrualValue"40. ,title: "SAP Accrual Value"41. ,width: 17042. ,format: "{0:c}"43. ,lockable: false44. ,editor: function(cont, options) {45. var amt;46. 47. kendo.culture("en-US"); 48. amt = kendo.toString(options.model.CurrentSAPValue, "c");49. 50. $("<span>" + amt + "</span>").appendTo(cont);51. }52. }53. ]54. , scrollable: true55. , sortable: true56. , filterable: true57. , columnMenu: true 58. , editable: true59. , resizable: true60. , selectable: "multiple"61. , save: function(d) {62. if (d.values.CurrentSAPValue) {63. d.model.set("SAPAccrualValue", d.model.Incurred - d.values.CurrentSAPValue);64. d.model.set('Dirty',true);65. } 66. }67. }); 68.}01.var btnUpdateDate = $('#btnUpdateAllDate')02. ,infoDialog = $('#infoDialog')03. ,btnInfoOK = $("#btnInfoOK").data("kendoButton")04. ,infoDialogMsg = $('#infoDialogMsg'); 05. 06.start = $("#StartDate").kendoDatePicker({value: new Date()}).data("kendoDatePicker");07. 08.end = $("#EndDate").kendoDatePicker({value: new Date()}).data("kendoDatePicker");09. 10.btnUpdateDate.kendoButton({11. click: function(e) {12. var startDate = start.value()13. ,endDate = end.value()14. ,parentGrid = $('#gridJobsH').data("kendoGrid")15. ,child = $('.k-detail-row').find('td.k-detail-cell').find('div.k-grid').data("kendoGrid"); 16. 17. if(endDate < startDate ) {18. infoDialogMsg.html('End date must be ahead to Start date.');19. infoDialog.data("kendoWindow").open();20. } else {21. 22. var chilEl = $('.hdChildGrid')23. ,childGrid = $(chilEl[0]).data('kendoGrid'); 24. 25. if(childGrid != null) {26. var dataSource = childGrid.dataSource;27. 28. dataSource.fetch(function() {29. var models = dataSource.data()30. ,modelsLength = models.length;31. 32. for (var i = 0; i < modelsLength; i++) {33. var m = models[i];34. 35. m.set('PeriodStart', startDate);36. m.set('PeriodEnd', endDate);37. } 38. });39. }40. } 41. }42.}); <script id="reportTemplate" type="text/x-kendo-template"> <div style="height:100px; width:300px;border:thin solid black;"> <h3><img src="/Content/Images/SuccessfulSaveTickMark.png" alt="" />#= title #</h3> <p> @Html.LabelFor(m => m.NotificationText) </p> <p> @(Html.Kendo().Button() .Name("viewNowButton") .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" }) .Content("View Now") ) @(Html.Kendo().Button() .Name("viewLaterButton") .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" }) .Content("View Later") ) @(Html.Kendo().Button() .Name("downloadButton") .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" }) .Content("Download") ) </p> <p> @(Html.Kendo().Button() .Name("redirectToReportPickupButton") .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" }) .Content("Go to Report Pick Up Page") ) </p> </div></script><script id="reportTemplate" type="text/x-kendo-template"> <div style="height:100px; width:300px;border:thin solid black;"> <h3><img src="/Content/Images/SuccessfulSaveTickMark.png" alt="" />#= title #</h3> <p> <label for="NotificationText">NotificationText</label> </p> <p> <button id="viewNowButton" onclick="javascript:validateSession()" type="button">View Now</button><script> jQuery(function(){jQuery("#viewNowButton").kendoButton({});});</script> <button id="viewLaterButton" onclick="javascript:validateSession()" type="button">View Later</button><script> jQuery(function(){jQuery("#viewLaterButton").kendoButton({});});</script> <button id="downloadButton" onclick="javascript:validateSession()" type="button">Download</button><script> jQuery(function(){jQuery("#downloadButton").kendoButton({});});</script> </p> <p> <button id="redirectToReportPickupButton" onclick="javascript:validateSession()" type="button">Go to Report Pick Up Page</button><script> jQuery(function(){jQuery("#redirectToReportPickupButton").kendoButton({});});</script> </p> </div></script>
$scope.line = {<br> cache:false,<br> legend: {<br> visible: false<br> },<br> title: {<br> text: "Last 10"<br> },<br> series: [{<br> type: "line",<br> style: "smooth",<br> field: "OBAmount",<br> categoryField: "date",<br> color: '#0c50dd'<br> }],<br> valueAxis: {<br> line: {<br> visible: false<br> }<br> },<br> tooltip: {<br> visible: true,<br> template: "#= kendo.format('{0:n2}', value) # "<br> }<br> }
var _manu = [{"text":"Acme","value":1},{"text":"Other","value":2}];function getManufacturerName(id) { for (var i = 0; i < _manu.length; i++) { if (_manu[i].value == id) { return _manu[i].text; } } return ''; }gridDataSource = new kendo.data.DataSource({ batch: true, transport: { read: { url: 'myUrl' }, }, schema: { model: { id:"ItemId", fields: { ManuId: { type: "number" } } } } });var kendoGrid = gridObj.kendoGrid({ dataSource: gridDataSource, selectable: "row", editable: true, columns: [ { field: "ManuId", title: "Manufacturer", editor: manufacturerDropDownEditor, template:"#= getManufacturerName(ManufacturerId) #" } ] }).data('kendoGrid');function manufacturerDropDownEditor(container, options) { $('<input data-bind="value:' + options.field + '"/>') .appendTo(container) .kendoDropDownList({ dataTextField: "text", dataValueField: "value", dataSource: _manu }); }