Questions on Kendo UI for jQuery Forum

4 answers

213 views

Are the Kendo UI Dataviz components supported on IE7/IE8. As far as I can tell, they seem to be using SVG for rendering, which is not supported by IE7/IE8. I tried this example: http://demos.telerik.com/kendo-ui/area-charts/index. It does not work on IE7 (emulation mode on IE11). Surprisingly it works in IE8 (emulation mode) although IE8 does not support SVG - I don't understand that part!

Charts

answered on 09 Jun 2014

1 answer

105 views

Require DataSourceFilter of kendo Grid as RadDataFilter control of Telerik

We are replicating the functionality of the RadDataFilter control of Telerik with DataSourceFilter of Kendo Grid.
Here certain filters like 'Does not contain', 'Is contained in', 'Is empty', 'Is null', 'Is not null' etc. are not found with the DataSourceFilter.
Hence, please provide us with some suggestion.

Grid

answered on 09 Jun 2014

1 answer

754 views

Filtering Doesn't Work Using a Template

I have a column called Due that contains a date from the server. On the client I use SetValAndColorForDue() to change the date to a the number of hours from today and I change the color to either Red or Black.

When I implement SetValAndColorForDue in the grid { field: "Due", title: "Due", width: 100, template: '#=SetValAndColorForDue(Due)#' , as seen below, the filtering doesn't work at all. I can see the filter options just that when I filter by the output nothing happens.

function SetValAndColorForDue(dueDate) {

var a = moment();

var b = moment(dueDate);

var duration = a.diff(b, 'hours');

if (duration > 24){

return "<font color=\"red\">" + duration + " </font>";

}

else {

return duration;

}

The grid: Focus on the BOLD code below.

$(document).ready(function () {

var selectedCaseID = 43;

$("#grid").kendoGrid({

height: 600,

columns: [

"InvestigationID",

{ field: "Status", title: "Status", width: 100 },

{ field: "FullName", title: "Full Name", width: 220 },

"Priority",

"Created",

{ field: "Due", title: "Due", width: 100, template: '#=SetValAndColorForDue(Due)#' },

"LastActivityDate",

"LastActivityBy"

],

selectable: "row",

pageable: {

info: true

}, // enable paging

filterable: true, // enable filtering

sortable: true, // enable sorting

//toolbar: ["create", "save", "cancel"], // specify toolbar commands

dataSource: {

serverPaging: true,

serverSorting: true,

serverFiltering: true,

pageSize: 50,

schema: {

data: "d.Data", // web methods return JSON in the following format { "d": <result> }. Specify how to get the result.

total: "d.Total",

model: { // define the model of the data source. Required for validation and property types.

id: "InvestigationID",

fields: {

InvestigationID: { type: "string" },

Status: { type: "string" },

FullName: { type: "string" },

Priority: { type: "string" },

Created: { type: "string" },

Due: { type: "string" },

LastActivityDate: { type: "string" },

LastActivityBy: { type: "string" }

}

},

transport: {

read: {

url: "/InvestigationDesign.aspx/Investigations", //specify the URL which data should return the records. This is the Read method of the Products.asmx service.

contentType: "application/json; charset=utf-8", // tells the web method to serialize JSON

type: "POST" //use HTTP POST request as the default GET is not allowed for web methods

},

parameterMap: function (data, operation) {

if (data.models) {

return JSON.stringify({ products: data.models });

} else if (operation == "read") {

//Page methods always need values for their parameters

data = $.extend({caseid: selectedCaseID, sort: null, filter: null }, data);

return JSON.stringify(data);

}

});

var grid = $("#grid").data("kendoGrid");

// Handles double click of grid.

$("#grid").on("dblclick", "tr.k-state-selected", function () {

var model = grid.dataItem(grid.select());

window.open("Investigation/DefaultAngularTest.aspx?invID=" + model.InvestigationID, "_blank");

});

Grid

answered on 09 Jun 2014

1 answer

262 views

Kendo Grid - Showing Aggregate values at each grid column footer

We have a grid which is having a column showing checkboxes in each row.
we are using Odata for taking data which is binded to kendo grid.
How to show the count at the footer for the number of checked record in kendo grid.

as per our investigation using Odata, server aggregates are not supported.

Grid

answered on 09 Jun 2014

1 answer

161 views

Button click with a little movement does not fire click event

Is there a way to make a button receive a click event when the user moves a little bit during the click?

On mobile devices I have found many users will move their finger a little bit when clicking on a button. In Kendo UI Mobile if movement occurs during the click the click event is not fired. To see this happen, run the following plunkr:

http://plnkr.co/edit/foJjBq87ou6mFSdLEq4k?p=preview

When clicking drag just a little bit and the click event will not fire. Only when you click with no movement will the click event fire.

I would like an event something like "touch up inside" which would fire when the user lifts their finger from a button.

Thanks,
Kerry

Button (Mobile)

answered on 09 Jun 2014

3 answers

510 views

inline editing in kendo grid

hello

1) i use and follow this grid

http://demos.telerik.com/kendo-ui/grid/editing-custom
http://trykendoui.telerik.com/

but i want to all field not editable true only like example "Product Name" allow to editable true and other two not..

so how to do this in kendo grid please help me.

2) and when i change value then new value save temporary and how to save new value on button click.

like first product name is "chai" and i update chai to tea then tea was
where to store i dont know and i want to tea store on other button click
like using ajax and this button is out side grid.

and then we make one button on outside kendo grid and when click on this
button and i want to get updated data(row) of this two row only and pass to
controller action using ajax.

so how to do this in kendo grid please help me.

reply asap

Grid

answered on 09 Jun 2014

4 answers

295 views

TreeView, TypeScript and Model Classes

Hi,

I'm using in my new project telerik kendo controls with angularjs, furthermore I want to use TypeScript.
This combination looks really good, but now I have following problem.

I have a hierarchical datasource for a treeview. The datasource is populated with my own javascript model class.

01.module MyNamespace {

02. 'use strict';

03.

04. export class Cluster {

05. public clusters: Cluster[];

06. public parentId: string;

07. public dateCreated: Date;

08. public dateModified: Date;

09.

10. constructor(

11. public id: string,

12. public matrixId: string,

13. public name: string,

14. public position: number

15. ) {

16.

17. this.clusters = [];

18. this.dateCreated = new Date();

19. this.dateModified = new Date();

20. }

21. }

22.}

If I try to get the selected node item, I get following typescript error:

Build: Cannot convert 'kendo.data.Node' to 'MyNamespace.Cluster'

The problem is, that .dataItem returns a node object and not my model class. If i try to cast the return value, i get this error:

Error: Cannot convert 'kendo.data.Node' to 'MyNamespace.Cluster': Type 'kendo.data.Node' is missing property 'clusters' from type 'MyNamespace.Cluster'. Type 'MyNamespace.Cluster' is missing property 'children' from type 'kendo.data.Node'

How can i get off this error?

Regards
Daniel

TreeView

answered on 09 Jun 2014

5 answers

151 views

Question about value MultiSelect function ?

I need to implement a kendo multiselect value with a json object

But,i don't know how to get a json object ? And if is it possible to store it in a variable ?

I need your help,

Best regards,

Kevin Quinton

MultiSelect

answered on 06 Jun 2014

1 answer

263 views

Iterating through all Kendo Windows on a page

Hi,

I hope this is something relatively simple to ask, I have looked around a little and couldn't find a decent enough resource to solve me problem.

I want to find all kendo windows on a given page without having to reference their id's. The purpose of this is that I am attempting to resize all kendo windows based on when the browser window resize event fires.

Whilst it could be possible to store an array of window id's I would prefer to not have to maintain that additional code.

Thank you in advance for any assistance you can provide.

Window

answered on 06 Jun 2014

6 answers

212 views

[Solved] Scroller repositioning problem after keyboard dismissed

I have a view with a textarea at the bottom. When I focus on the textarea the keyboard pops up and pushes the textarea up so you can see what you are typing in the input. The problem is when the keyboard is dismissed it doesn't reposition the scroller and leaves whitespace at the bottom where the keyboard was overlayed. Also if you try to scroll back to the top it to top appears to be cut off the same distance of the white space left at the bottom as if the whole slider has been shifted up by that amount. Is there a solution for this issue?

Scott

View

answered on 06 Jun 2014