or
var vm = kendo.observable({ getAgentOnlyFound: function(){....},});var dataSourceOnlyFound = new kendo.data.DataSource({
transport: {
read: function(options) {
options.success(vm.getAgentOnlyFound());
},
},
schema: {
parse: function (data) {
$.each(data, function (i, val) {
val.EffectiveDate = kendo.toString(new Date(parseInt(val.EffectiveDate.substr(6))), "MMM/dd/yyyy");
});
return data;
},
model: {
id: "Id"
}
}
});
$("#agent-list-grid").data("kendoGrid").setDataSource(dataSourceOnlyFound);
<div id="agent-list-grid" data-role="grid" data-editable="false" data-columns="[ { 'field': 'FullName', title: 'Agent Name', 'width': 270 }, { 'field': 'Country.Name', title: 'Country' }, { 'field': 'EffectiveDate', title: 'Effective Date' }]" data-bind="visible: isListView"><div class="form-group" ng-class="{'has-error' : editForm.Source.$error.required}"> <label for="Source" class="control-label required">Source</label> <input type="text" id="Source" name="Source" ng-model="vm.data.record.source" class="form-control input" required /></div><div class="form-group"> <label for="Author" class="control-label">Author</label> <input type="text" id="Author" name="Author" ng-model="vm.data.record.author" class="form-control input" /></div><div class="form-group" ng-class="{'has-error' : editForm.PressCuttingDate.$error.required}"> <label for="PressCuttingDate" class="control-label required">Date</label> <input type="date" kendo-date-picker id="PressCuttingDate" name="PressCuttingDate" k-ng-model="vm.data.record.pressCuttingDate" k-format="'dd/MM/yyyy'" style="width: 100%" required /></div><div class="form-group" ng-class="{'has-error' : editForm.Source.$error.required}"> <label for="Source" class="control-label required">Source</label> <input type="text" id="Source" name="Source" ng-model="vm.data.record.source" class="form-control input" required /></div><div class="form-group"> <label for="Author" class="control-label">Author</label> <input type="text" id="Author" name="Author" ng-model="vm.data.record.author" class="form-control input" /></div><form name="editForm" novalidate kendo-validator="vm.formValidation"><div class="form-group" ng-class="{'has-error' : vm.formValidation.validateInput($('input[name=PressCuttingDate]')) }"> <label for="PressCuttingDate" class="control-label required">Date</label> <input type="date" kendo-date-picker id="PressCuttingDate" name="PressCuttingDate" k-ng-model="vm.data.record.pressCuttingDate" k-format="'dd/MM/yyyy'" style="width: 100%" required /></div><%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %><!DOCTYPE html ><html><head runat="server"> <title></title> <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" /> <style> .appboundary { padding: 10px; width: 100%-40px; height: 100%; background-color: #fff; margin: 20px; -moz-box-shadow: 0 0 0 4px #FFF, inset 1px 0px 10px #C3C4C7, 0px 1px 6px 6px rgba(10,0,0,.5); -webkit-box-shadow: 0 0 0 4px #FFF, inset 1px 0px 10px #C3C4C7, 0px 1px 6px 6px rgba(10,0,0,.5); box-shadow: 0 0 0 4px #FFF, inset 1px 0px 10px #C3C4C7, 0px 1px 6px 6px rgba(10,0,0,.5); -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } </style></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> <Scripts> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> </Scripts> </telerik:RadScriptManager> <script src="http://cdn.kendostatic.com/2013.1.319/js/kendo.all.min.js"></script> <script> function createChart() { $("#donutholder").kendoChart({ title: { visible: false }, legend: { visible: false }, chartArea: { background: "", height: 180, width: 180 }, seriesDefaults: { type: "donut", startAngle: 90, holeSize: 60, size: 20, overlay: { gradient: "sharpBevel" } }, series: [ { data: [ { category: "Promoted", value: 2, color: "#931d2f" }, { category: "Failed Attempts", value: 1, color: "#e4a612" } ], labels: { visible: false, background: "transparent", position: "outsideEnd", template: "#= category #: #= value#%" } } ], tooltip: { visible: true, template: "#= category #: #= value#" } }); } $(document).ready(function () { setTimeout(function () { createChart(); }, 400); }); </script> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> </telerik:RadAjaxManager> <div> <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" /> <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1"> <telerik:RadDockLayout runat="server" ID="RadDockLayout1"> <telerik:RadDockZone ID="RadDockZone1" runat="server" CssClass="appboundary" FitDocks="True" BorderStyle="None" Style="max-width: 1200px"> <telerik:RadDock runat="server" ID="RadDock1" DefaultCommands="ExpandCollapse" DockMode="Docked" EnableDrag="False" EnableAnimation="True"> <ContentTemplate> <div style="float: right" id="donutholder"> </div> </ContentTemplate> </telerik:RadDock> </telerik:RadDockZone> </telerik:RadDockLayout> </telerik:RadAjaxPanel> </div> </form></body></html>filterable: {extra: false,cell: {template: function (input) {input.kendoDropDownList({...,filterMenuInit: function (e) { if (e.field === "DateRequested") { var beginOperator = e.container.find("[data-role=dropdownlist]:eq(0)").data("kendoDropDownList"); beginOperator.value("gte"); beginOperator.trigger("change"); var endOperator = e.container.find("[data-role=dropdownlist]:eq(2)").data("kendoDropDownList"); endOperator.value("lte"); endOperator.trigger("change"); } },...