Questions on Kendo UI for jQuery Forum

2 answers

471 views

Miscellaneous issues with Kendo UI drag and drop

My goal is to create a drawing surface (container) with DIVs containing HTML, where such DIVs have handles (draggable) to move, resize and rotate them.

At this stage my questions pertain to the prototype at http://dojo.telerik.com/isatE.

In Chrome, Firefox, IE and Safari (latest versions on Windows 8.1 with all updates), a shadow of the draggable square flickers at the top left corner of the container when dragging the square forth and back. To reproduce simply drag the square around the container for sufficient time. Apparently, (e.offsetX, e.offsetY) sometimes returns (0, 0) for a reason I cannot explain.

Looking at the console (it might be a different problem), there is an error originating from kendo.all.min.js.
Chrome displays: "Uncaught TypeError: undefined is not a function"
IE displays: "SCRIPT438: Object doesn't support property or method 'offset'"
Firefox displays: "TypeError: e[t] is not a function"
Safari displays "TypeError: 'undefined' is not a function (evaluating 'e[n]()')"

Please help:

Get rid of the flickering;
Get rid of console error messages;
Validate our code considering we cannot use a hint (rotate and resize planned for next step).

Drag and Drop

answered on 14 Jan 2015

1 answer

617 views

Grid inline editing error messages show the field's name, not it's title

Hi!

Grid's inline editor's validation messages show the field names, not the field titles. For example here, or see the attached image.
Not really noticable with english field names, but if your field names, and titles differ significantly, the difference is pretty big...

Grid

answered on 14 Jan 2015

8 answers

248 views

Stock chart Navigator data

Hi,
I'm trying to figure out why the bar chart displayed in the navigator clusters together as the data in the chart increases over time. As time progresses, the bars cluster together. I would like them to be bars of 1 minutes intervals and that is the granularity of the data I provide.

Secondly, how do I display tooltip to show the bar charts values in the navigator? As you can see, I've enabled tool-tips but nothing shows up.

Below is how I've configured the stock chart's navigator. The attached screenshot shows how the bar chart looks initially.

navigator: {

series: {

type: "column",

field: "tradeVolume",

categoryField: "tradeTime",

tooltip: {

visible: true

},

color: "#D2E399"

},

categoryAxis: {

baseUnit: "minutes",

baseUnitStep: "1",

justified: true,

labels: {

visible: true

}

},

Charts

answered on 14 Jan 2015

2 answers

718 views

[Solved] Grid HyperLink

Hello everyone,

I am converting razor syntax to MVVM and facing a challenge with the current grid that I am working on. My grid is working, however, I am attempting to add a hyperlink to a menteeFullName, which loading the Mentee/Edit Controller ID. Your help would be greatly appreciated - thanks Michael

Here is my razor syntax

@(Html.Kendo().Grid(Model)

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.MenteeFullName).Title("Name").Width(40).Filterable(false).ClientTemplate(

"<a href='" + Url.Action("Edit", "Mentee", new { ID = "#=MenteeId#" }) + "'>#=MenteeFullName#</a>");

columns.Bound(c => c.MenteeType).Title("Mentee Type").Width(40);

columns.Bound(c => c.InstitutionName).Title("Training Period Institution").Width(30);

columns.Bound(c => c.YearStarted).Format("{0:dd/MM/yyyy}").Title("Training Period Start Year").Width(60);

columns.Bound(c => c.YearEnded).Format("{0:dd/MM/yyyy}").Title("Training Period End Year").Width(60);

columns.Bound(c => c.CompletedDegree).Title("Completed Degree").Width(40);

})

)

</div>

<script>

$(function () {

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

});

</script>

Here is my working code

<div id="menteeGrid" data-role="grid"

data-editable="false"

data-selectable="true"

data-scrollable="true"

data-sortable="true"

data-pageable="false"

data-columns="[

{ 'field': 'ID'},

{title:'Name','field': 'menteeFullName'},

{title:'Mentee Type','field': 'menteeType'},

{title:'Training Period Institution','field': 'institutionName'},

{title:'Training Period Start Year','field': 'yearStarted'},

{title:'Training Period End Year','field': 'yearEnded'},

{title:'Completed Degree','field': 'completedDegree'},

]"

data-bind="source: menteesGridView">

</div>

<script>

$(document).ready(function () {

var menteeVm = kendo.observable($.extend({

menteesGridView: new kendo.data.DataSource({

type: "json",

serverFiltering: true,

transport: {

read: {

url:'@Url.Content("~/CommonData/GetMenteeList")',

datatype:"json",

data: {

name: function(){

return $("#menteeGrid").data("grid").value();

}

}),

},@(Html.ToJson(Model))));

kendo.bind($("#mentee-view"), menteeVm);

$("#menteeGrid").data("kendoGrid").hideColumn(0);

})

</script>

Grid

answered on 13 Jan 2015

5 answers

1.1K+ views

Date given as string doesn't sort properly

I am supplying a date in M/d/yyyy as string in a template for the column :
But when you sort the OrderDate column, it doen't seem to sort the dates properly - it puts the column values arbitrarly. Any clues why ??

model: {
id: "MSOrderNumber",
fields: {
OrderNumber: { type: 'string' },
OrderDate_String: { type: 'string' },

columns: [
{ field: "OrderNumber", title: "Order Number" },
{ field: "OrderDate_String", title: "Order Date", template: '#= kendo.toString(ConvertStringToKendoDate(OrderDate_String), "M/d/yyyy" ) #' },

Using this little function to get a formatted Date from string
function ConvertStringToKendoDate(value)
{
var escapeRegExp = function (str) {
return str.replace(/[\-\[\]\/\{\}\*\+\?\.\\\^\$\|]/g, "\\$&");
}
var replaceAll = function (find, replace, str) {
return str.replace(new RegExp(escapeRegExp(find), 'g'), replace);
}
var find = '-';
if (value != null && value != undefined && value != '') {
value = replaceAll(find, '/', value)
value = new Date(value);
}
return value;

}

Grid

answered on 13 Jan 2015

1 answer

4.9K+ views

[Solved] How to get total record count from datasource?

I am trying to get the total record count from a datasource using:

var totalCount = myDataSource.total();

The datasource has more than 1 record in it and I am able to display the records in a ListView, but the above variable is always zero.

Can someone tell me if I'm using the right command?

Data Source

answered on 13 Jan 2015

1 answer

86 views

[Solved] Problem with hierarchical grid and customised filters

I've got a hierarchical grid set up and working nicely. However, any time I try to customise the filters on the sub-grid, it throws an error in the kendo.all.min.js. If I Break on the exception and inspect the variable "u" in the catch, it shows: Expected ';'

Here's the filter that I'm trying to apply:

.Filterable(filter => filter

.Operators(ops => ops

.ForString(str => str.Clear()

.Contains("Contains"))))

This is an ASP.NET MVC project using Kendo 2014.2.903.

Hope someone from Telerik can help.

Thanks.

Grid

answered on 13 Jan 2015

6 answers

334 views

Grid Angular k-rebind issue since Q3 update

The scenario is we're using AngularJS and we're loading the options for the grid dynamically from the server so we need to use k-rebind on the options to make the options refresh from the server call. This used to work fine but has stopped working since the latest update. We've constructed an example based on the Telerik grid demo site. The issue is that the grid refreshes whenever you do any http activity during a grid resize or reorder event. As you can see, it works if you change the version back to Q2 SP2:

http://dojo.telerik.com/IGiDI

Please advise if there's anything specific we need to make this work.

Grid

answered on 13 Jan 2015

2 answers

558 views

Any way to change the "data-placeholder" value to change the text of an empty control?

Been working on it here http://jsfiddle.net/qy85emc8/8/ Can't figure it out.

MultiSelect

answered on 13 Jan 2015

1 answer

168 views

Kendo grid and breeze

Hello,
I'm using kendo grid with breeze. I get "Maximum call stack size exceeded" error when I use breeze data as kendo grid datasource. I come across the same error with kendo combobox and breeze. There are some explanations pointing that this error results from circular reference (i.e. http://www.breezejs.com/documentation/knockout-circular-references). Is there any way to use kendo databound components with breeze. Do you recommend to use breeze-kendo (kendo.data.breeze.Source).

Thanks in advance.
Mahmut Zemheri

Grid

answered on 13 Jan 2015