Hi All
I am using kendo UI 2016.1.112 with angular and I am having an issue with sorting, the first time e.data.sort is populated nicely with the field and direction , second time same field and direction as desc but clicking for third time get an empty array
dataSource: { transport: { read: function (e) { if (!e.data.sort || e.data.sort.length === 0) { ///WTH ..... WHY?
} var sort = e.data.sort[0]; exclusionsService.getExclusions(e.data.skip, e.data.take, sort.field, sort.dir).then(function (data) { e.success(data); });...
I've got xslt file which consists of many tables.
I set id to each table. How can I set grid on id?
<table class="grid" id="ID0EEC">
<tbody><tr>
<th>Numb</th>
<th>Time</th>
<th>Type</th>
</tr>
<tr>
<th>47217283640322</th>
<th>10.01.2014 15:25:17</th>
<th>ATM</th>
</tr>
<tr>
<th>46961091840322</th>
<th>12.01.2014 09:07:47</th>
<th>Kasino</th>
</tr>
<tr>
<th>46519990240322</th>
<th>25.01.2014 22:47:00</th>
<th>Cash</th>
</tr>
</tbody></table>
<table class="grid" id="ID0EJG">
<tbody><tr>
<th>Numb</th>
<th>Time</th>
<th>Type</th>
</tr>
<tr>
<th>47217283640322</th>
<th>10.01.2014 15:25:17</th>
<th>ATM</th>
</tr>
<tr>
<th>46961091840322</th>
<th>12.01.2014 09:07:47</th>
<th>Kasino</th>
</tr>
<tr>
<th>46519990240322</th>
<th>25.01.2014 22:47:00</th>
<th>Cash</th>
</tr>
</tbody></table>
I would like to do smth like thin in JS
var gridArray = $("#grid");
for (var i = 0; i < gridArray.length; i++) {
var tmp = gridArray[i];
var numb = tmp.getAttribute('id');
$("#" + numb).kendoGrid({});
}
What is wrong?

What I'm trying to do is display some data in a specific column that is calculated by using the data from another column.
I currently have a function that returns the number of available licenses for the given 'Id' in JSON:
function getAvailableLicenses(id) { var url = "/Host/Organization/AvailableLicenses/" + id; $.get(url, function (data) { return data.AvailableLicenses; });}
How do I go about displaying the number that is returned in a column named "AvailableLicenses"?
Here is my current Grid:
$("#OrganizationGrid").kendoGrid({ dataSource: viewModel.get("orgDataSource"), filterable: { extra: false }, sortable: true, pageable: true, columns: [ { field: "Id", hidden: true }, { field: "Name", template: "<a href='/Host/Organization/Detail/#:Id#'>#:Name</a>"}, { field: "LicenseNumber", title: "Number of Licenses" }, { field: null, title: "Available Licenses", template: "#= getAvailableLicenses(Id) #" }, { field: "LicenseExpiration", title: "License Expiration", format: "{0:MM/dd/yyyy}" }, { field: "State" }, { field: "Active" } ], editable: false});
As you can see, I tried to create a null column with a template that calls the function for the given 'Id'.
By using Fiddler, I can see that the function is indeed being called for all of the rows, but the 'AvailableLicenses' column just displays "undefined" for every row.
Is there something I'm missing here to get this to work?
I could have a very n-deep treeview but the way the dataTextfield operates solves my problem. Is it possible, when the node is expanded, that you modify the array for which the dataTextField is displayed?
For example:
When the call is made to the service, the JSON Object return is:
The first node name should be : VBN
so the dataTextField: [SSM.securitySelectionModelName]
{"id": 1, "isSSMNameNode": true, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildNode": true, "ext_model_id": 1, "parent": null, "SSM": {"id": 1, "securitySelectionModelName": "VBN"}
On the next get, it should be ["SSM.securitySelectionModelName", "SSM.classificationName]"
[{"id": 2, "isSSMNameNode": false, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildNode": true, "ext_model_id": 14, "parent": {"id": 1, "isSSMNameNode": true, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildNode": true, "ext_model_id": 1, "parent": null, "SSM": 1, "classificationNameNode": null}, "SSM": {"id": 1, "securitySelectionModelName": "VBN", "classificationNameNode": {"id": 14, "classificationLevel": 2, "classificationName": "MBS", "hasChildNode": false, "parent": 2}}]
Is this possible to do on the expand event where I create the dataTextField array dynamically?
Hi,
I'm not able to add Multi column Header grid. I'm trying this
@(Html.Kendo().Grid<SkyResMVC.Models.TAChartDetails>()
.Name("TAChartGrid")
.HtmlAttributes(new { style = "height: 400;" })
.Scrollable()
.Columns(columns =>
{
columns.Bound(p => p.RoomType).Width(120).Title("A");
columns.Group(group => group
.Title("Contact Info")
.Columns(info =>
{
info.Bound(x => x.ContactTitle).Width(200);
})
);
})
)
I'm getting error like this-
Kendo.Mvc.UI.Fluent.GridColumnFactory<SkyResMVC.Models.TAChartDetails>' does not contain a definition for 'Group' and no extension method 'Group' accepting a first argument of type 'Kendo.Mvc.UI.Fluent.GridColumnFactory<SkyResMVC.Models.TAChartDetails>' could be found (are you missing a using directive or an assembly reference?)
Please help me in this....
I'm using the grid setOptions/getOptions to save a particular view for a grid. Basically a user can filter the grid in a certain way, show and hide columns, etc.
In the grid I have several inline drop downs. This is an example of one of the field definitions:
{ field: "LocationId", title: "Location Name", width: 200, editor: gridHelper.locationDropDownEditor, template: "#=gridHelper.getLocationCode(LocationId)#" },
On initial load everything works absolutely fine. The problem comes in when the user selects a different view and I call setOptions to instantiate that view. For the most part everything works, however when clicking on a cell with a dropdown the dropdown does not get reinitialized as a dropdown. It's simply a text field with the right Location Name displayed, however when you click it you get the id#.
Is there a proper way to reinitialize those dropdowns using the model I've given above?
I've tried refreshing both the grid and the datasource along with destroying and recreating the grid from scratch but no options seem to lead to something that will work.
Thanks!
Hi,
when I use declarative syntax, e.g.
<div id="app">
<div id="list" data-role="list" data-bind="source: productsSource" data-template="tmpl"></div>
<div id="pager" data-role="pager" data-bind="source: productsSource"></div>
</div>
and use MVVM binding to bind to dataSource:
var vm= kendo.observable({
productsSource: new kendo.data.DataSource({
pageSize: 4, page: 1,
serverFiltering: true,
serverSorting: true,
transport: {
read: {
url: "http://demos.telerik.com/kendo-ui/service/Products",
dataType: "jsonp"
}
}
})
});
kendo.bind($("#app"), vm);
there are two requests to http://demos.telerik.com/kendo-ui/service/Products (one for list and one for pager).
The whole example could be seen on: http://dojo.telerik.com/OHeMI/2
It is possible to reduce request count only to one?
var categoryWindow;$(document).ready(function () { categoryWindow = $("#category-tree").kendoWindow({ actions: ["Close", "Maximize"], draggable: false, height: "350px", modal: true, resizable: false, title: "Browse Document Categories", width: "500px", visible: false }).data("kendoWindow");});<div id="category-tree"> @(Html.Kendo().TreeView() .Name("category-treeview") .DataTextField("Name") .Events(e => e.Select("onTreeViewSelect")) .DataSource(ds => ds.Read(r => r.Action("TreeView", "Categories"))))</div>Hi,
I have created custom popup for kendo scheduler to Add and Edit details using Kendo template. However, I want to add kendo autocomplete and kendo multiselect on the popup. I have attached screenshot of the popup.
The issue we are facing is how to populate "AUTO COMPLETE" & "MULTI-SELECT" controls on the scheduler popup (which is already working on Modal popup but somehow it does not work on "Scheduler Popup".
I have reproduced this issue in here ... http://dojo.telerik.com/@Salmal/OcALi
I am implementing Kendo Charts for my AngularJS application . I have a scenario where i need to change the type of the Chart when user clicks on a button .
For this i am using k-series-defaults attribute directive and for its value i am binding a scope variable from controller . Please see below code snippets.
View.html
<div class="demo-section k-content wide"> <div> <h4>Hover some series</h4> <div kendo-chart k-legend="{ position: 'bottom' }" k-series-defaults="{ type: 'pie' }" k-series="[{ field: 'amount', categoryField: 'name'}]" k-data-source="chartData" k-rebind="chartData"> </div> </div></div>Ctrl.js
$scope.chartData = [ { "name": "Books", "amount": 200 }, { "name": "Newspapers", "amount": 320 }, { "name": "Magazines", "amount": 225 }, { "name": "Shoes", "amount": 400 } ]; $scope.update = function () { $scope.ChartType = { type: 'bar' }; }; $scope.ChartType = { type: 'pie' };
My problem is that , the ChartType variable change doesn't reflect in the chart rendered in the view . Which means that the AngularJS 2 way binding doesn't work with the kendo ui charts . Is there something i am missing here , or can we use some alternatives such as ObservableArray as specified here http://docs.telerik.com/kendo-ui/AngularJS/data-source#update-the-datasource-object . ?