Questions on Kendo UI for jQuery Forum

3 answers

131 views

[Solved] x-axis dates are tightly packed in bar chart

I'm having a series of graphs in which the dates that are displaying in x-axis appear to be tightly packed.Is there any solution to compromise the appearance of dates so that the graph looks clear and readable.

Please refer to the screen shot.

Charts

answered on 04 May 2016

7 answers

1.3K+ views

Odata not working with custom authorization header

Hi,

I have a serious issue with odata requests and an authentication header I have to set - it just is not working! Here is the transport part of my datasource definition (done inside the grid configuration:

transport: {

type: "odata",

read: {

url: "http://........",

beforeSend: function (xhr) {

var auth = 'Bearer ' + token;

xhr.setRequestHeader('Authorization', auth);

}

},

If I remove the line saying "type = odata", then the header is correctly set (of course, the request is not delivering useful data then...). If I add the line, the "beforeSend" part is executed, but the header is not set in the request.

Could this be a bug?

Best regards,
Gheorghe

Data Source

answered on 04 May 2016

3 answers

958 views

Angular column template function

I have the need to generate custom HTML by converting each data item returned for a given column when using Angular MVVM.

It seems that I can get the function called when it exists in the controller scope, but the HTML I return doesn't seem to be formatted in the column it just treats it as plain text.

{ "field": "note",
"title": "Notes",
width: "60%",
template: "<span ng-bind=formatNote(dataItem.note)>#= data.note# </span>"
}

$scope.formatNote = function(data) {
return data.replace(/ /g,"<p>");
};

Grid

answered on 04 May 2016

3 answers

180 views

validation using ng-pattern not working on mouse select

Hi.

I'm validating time picker using ng-pattern with 24 hours format. it is working on key events,but on selection of time picker drop down.

Find the DOJO and the screenshot.

Appreciate your support on this.

DatePicker

answered on 04 May 2016

1 answer

112 views

Firing a javascript function onLaunch of a custom template

I have a Kendo scheduler that contains a Custom editor template for the add/edit item form.

The form contains radio buttons.

<fieldset>
<label><input type="radio" name="use_oib_framework_nb" value="1" required="required" data-bind="checked:use_oib_framework_nb" onClick="javascript:toggleExtContFields('none');" /> #getResource("template.yes")#</label>
<label><input type="radio" name="use_oib_framework_nb" value="0" required="required" data-bind="checked:use_oib_framework_nb" onClick="javascript:toggleExtContFields('block');" /> #getResource("template.no")#</label>
</fieldset>

When one of these radio buttons is clicked, it runs a very simple Javascript...

function toggleExtContFields(property) {
document.getElementById('extContFields').style.display = property;
}

...which shows or hides a div.

<div style="display:none;" id="extContFields">[content]</div>

However, when the Custom editor template launches, I need to run the function passing it the current value of the use_oib_framework_nb radio buttons so it knows whether to make the div visible or not. Something like, "on popup window launch, look at the value of use_oib_framework_nb and run the function toggleExtContFields()".

How do I do that?

Scheduler

answered on 04 May 2016

3 answers

180 views

Change notification for deleted row

I've noticed that when the user performs a 'cut' operation to a row, the spreadsheet's Change event is fired. However, there doesn't appear to be a way to determine that the range was actually cut - or am I missing something?

Also, when a row deletion happens, the change event isn't fired at all. This is presenting a problem for me as I have a set of related data on the page that needs to reflect changes as the user modifies the spreadsheet. Is there a way to effectively catch row deletions?

Spreadsheet

answered on 04 May 2016

1 answer

234 views

Popup of the autocomplete sometimes shows no items

Hello,

I have an autocomplete. It has filtering event handler to prevent data loading when there are less than 3 characters typed by the user. Sometimes, when I type the 3 characters very fast, popup with no items is shown. When I type the 4th character, the items appear.

The data are loaded from the remote server, so I would say that the problem is caused by a late response from the server. But I don't know why the popup doesn't show the items after it receives the response. Or is there a way to display the popup programatically?

This is the code that creates the autocomplete:

$("#institution").kendoAutoComplete({

delay: 0,

template: "<span id='accountname'>#:name#</span><span id='accountid' style='display:none'>#:id#</span>",

filtering: function (e) {

var filter = e.filter;

if (!filter.value || filter.value.length < 3

) { //prevent filtering if the filter is an empty string, or if the value is too short, so it would have to load many items

e.preventDefault();

this.close();

}

else {

this.dataSource.options.transport.read.data.fetchxml = "<fetch mapping='logical'> <entity name='account'> <order attribute='name'/> <filter> <condition attribute='name' value='" +

$("#institution").val() + "%' operator='like' /> <condition attribute='statecode' value='0' operator='eq'/> </filter> </entity> </fetch>";

this.dataSource.read();

}

});

Thanks for your answers.

Boris

AutoComplete

answered on 04 May 2016

3 answers

537 views

Cannot read property 'recurrenceException' of undefined

1. Creating events by adding them to the schedulerDataSource programatically

2. Everything works, except recurring events

3. As soon as a recurring event exists, all events are messed up - displayed in wrong time slots, and remaining calendar events wont display at all.

Exception is:

kendo.all.js line 61287

Uncaught TypeError: Cannot read property 'recurrenceException' of undefined

_addExceptionDate: function(e) {
var t = e.start
, n = this.reader.timezone
, i = this.get(e.recurrenceId)
, r = i.recurrenceException || "";
L.isException(r, t, n) || i.set(se, r + L.toExceptionString(t, n))
}

The offending line is:

r = i.recurrenceException || "";

i is the Recurrence ID of the Event.

i cannot have a child property, from what I see, called recurrenceException. Why wouldnt r = this.get(e.recurrenceException)?

Looking for a solution - this is a time sensitive project (of course) and this one issue is holding up everything else from being delivered; all of the remaining functions and features are great and working, so I think I have a grasp on it, but this one is not working.

Scheduler

answered on 04 May 2016

12 answers

233 views

[Solved] Strange behavior in Chrome

Hi,

I'm using the Kendo UI Diagram on a project. The project targets the Chrome browser - so I've only testet in Chrome.

Sometimes I experience a strange behavior where the entire diagram is moved when I click and hold somewhere on the diagram and move the mouse - the same way as the diagram is moved when Ctrl is held down, the mouse is clicked and held down on an empty spot and the mouse is moved. I can't select anything on the diagram or make new connections - everything is just moving around.

Sometimes I can simply close Chrome and start it again and everything is back to normal - sometimes I have to restart the computer to make the diagram work as expected.

Any idea what's going on?

Diagram

answered on 04 May 2016

4 answers

443 views

[Solved] Issue with grid.editCell() and locked columns

Hi. I'm having issues getting the grid.editCell() function when using a grid with locked columns.

I have a grid where the first two columns are locked and I want to put the third column in edit mode. This third column is the first column of the unlocked section of the grid.

For exaple, this works: grid.editCell($("#ddhsampintgrid tr:eq(" + (selectedIndex + 2) + ")").find("td:eq(0)"));

and this works: grid.editCell($("#ddhsampintgrid tr:eq(" + (selectedIndex + 2) + ")").find("td:eq(1)"));

but this does nothing: grid.editCell($("#ddhsampintgrid tr:eq(" + (selectedIndex + 2) + ")").find("td:eq(2)"));

Any ideas on how to get this to work when using locked columns?

Thanks,

Ian

Grid