Questions on Kendo UI for jQuery Forum

1 answer

274 views

Hi

I'm evaluating the Kendo UI Web Grid. I want to make a column read-only and found a solution in the Telerik Forums, telling me to set the editable-property of that column to false in my js-file through the schema-model-fields-collection.
I've tried it and it works.
But I'm using AngularJS and want to configure this UI-concern directly in my html, rather then injecting this configuration into my angular-controller (seperation of concerns is a very important topic for me).
Is there a way to configure this readonly setting directly in my html-page?
I've tried it in the html-page, but the following html-snippet does not put the Id-column in the desired readonly state.

<div kendo-grid k-data-source="products"
k-selectable = "'multiple'"
k-editable = true
k-navigatable = true
k-columns='[
{ "field": "productId", "title": "ID", "width": 100, "editable": false},
{ "field": "productName", "title": "Artikel"},
{ "field": "productDescription", "title": "Omschrijving" }
]'>
</div>

Many thanks in advance.

Dirk Schelfaut
Belgium

Grid

answered on 07 Mar 2014

7 answers

588 views

Grid - Real-Time Data updates

We need to grid to display updates from server. The updates might be up to 1000 per second. We will have grid with virtualization.
I am trying to update the datasource with changes. The page is crashing with in minutes. Could you please let me know how should I do this efficiently.

Grid

answered on 07 Mar 2014

9 answers

119 views

Seconds as CategoryAxis BaseUnit

Hi Kendo team,

I need to use 'seconds' as the baseUnit for categoryAxis. Is this possible, if so, how please?

Thanks,
Amrinder

Charts

answered on 07 Mar 2014

5 answers

390 views

Setting default values to treeview

Hi,
I have the following setup:
I'm using angularjs.
I have a treeview in one page, and I keep the stats to this page in a session variable (a "Service", across all my pages).
Everything works fine, and the treeview loads fine.
The only problem is - how do I keep the selected nodes across all pages, and show them when relevant (i.e. when I get back to the page with the treeview)?
I can keep the data in the service, so it is availablein the following format:

{nodesItems: [{text: 'text1', id: 'id1', checked: 'true'}, ...]}

As I wrote above, the treeview appears, but how do I set the relevant nodes to be checked?

TreeView

answered on 07 Mar 2014

2 answers

59 views

keyboard navigation Issue

Hi,
I have encountered a strange problem. the problem is listed below.

I have a grid in which there are comboboxes in the fields which appear when the focus is set on the field(inline editing).
Now coming to the problem, when I have the focus in a field and click on the tab(of the keyboard) key the focus is sent to the next field and the combobox does not display properly and also it does not function properly.Now if i press the esc key and then click on tab it works properly. Please help. I am using the web version of kendo and not the MVC one. So please give me a sample code where I can have comboboxes in the consecutive fields and navigat thru them using the tab key. Also we are using the kendo version of v2013.2.918
Thanks in advance

Regards,
Vijay

Grid

answered on 07 Mar 2014

2 answers

173 views

Use "Enter" to select row/cell

I know we can use the space bar, but there is a requirement to use the enter key also/instead. Is there something like this built into the Grid? What would be the best/suggested way of adding this functionality to the grid in general?

Grid

answered on 06 Mar 2014

1 answer

251 views

Labels of donut outside of chart area

Hi,

I've been trying to use the donut component. However, Kendo DataViz does not render the label inside the box as you can see in the image. I've tried to change the chartArea width, but it seems to do nothing :(.

Is this possible?

Side question: I'd like to add a break line to the label (so I can show the percentage in the next line). I've tried adding <br> as the template, but it's not rendered.

Thanks!

Charts

answered on 06 Mar 2014

5 answers

106 views

Kendo Mobile 2013.2.1024 ModalView widget Open event handler not firing

The ModalView open event handler is not firing as per the documentation below whether I call the open method $("#mvTest").data("kendoMobileModalView").open() or use data-rel="modal" and href="#mvTest" attributes on a button widget.

http://docs.kendoui.com/api/mobile/modalview#events-open

ModalView

answered on 06 Mar 2014

6 answers

2.8K+ views

Hide/Display an existing Window

Upon loading, the windows are there but hidden by default.

I thought I had it where a click of the button would toggle the window (hide/show), but it was only creating another instance.

What am I missing?

<div class="k-widget k-tabstrip k-header">

@* Window buttons. *@

<table style="width:100%">

<tr style="text-align:center">

<td><button id="inProgressBtn" class="k-button">Work in Progress</button></td>

<td><button id="agingBtn" class="k-button">Aging</button></td>

<td><button id="recentBtn" class="k-button">Most Recent</button></td>

<td><button id="miscBtn" class="k-button">Miscellaneous</button></td>

<td><button id="allBtn" class="k-button">All Matters</button></td>

</tr>

</table>

</div>

@* Billable Work In Progress window. *@

<div id="inProgressDiv">

@(Html.Kendo.Window _

.Name("inProgressCWindow") _

.Title("Billable Work in Process") _

.Content(Html.Partial("_InProgressStatus", Model).ToHtmlString()) _

.Draggable _

.Width(300) _

.Visible(False) _

.Actions(Function(actions) actions.Close)

)

</div>

@* Aging window. *@

<div id="agingDiv">

@(Html.Kendo.Window _

.Name("agingCWindow") _

.Title("Accounts Receivable Aging") _

.Content(Html.Partial("_AgingStatus", Model).ToHtmlString()) _

.Draggable _

.Width(300) _

.Visible(True) _

.Actions(Function(actions) actions.Close)

)

</div>

@* Most recent window. *@

<div id="recentDiv">

@(Html.Kendo.Window _

.Name("recentCWindow") _

.Title("Most Recent") _

.Content(Html.Partial("_RecentStatus", Model).ToHtmlString()) _

.Draggable _

.Width(400) _

.Visible(False) _

.Actions(Function(actions) actions.Close)

)

</div>

@* Miscellaneous window. *@

<div id="miscDiv">

@(Html.Kendo.Window _

.Name("miscCWindow") _

.Title("Miscellaneous") _

.Content(Html.Partial("_MiscClientStatus", Model).ToHtmlString()) _

.Draggable _

.Width(300) _

.Visible(False) _

.Actions(Function(actions) actions.Close)

)

</div>

@* All window. *@

<div id="allDiv">

@(Html.Kendo.Window _

.Name("allCWindow") _

.Title("All Client") _

.Content(Html.Partial("_AllClientStatus", Model).ToHtmlString()) _

.Draggable _

.Visible(False) _

.Actions(Function(actions) actions.Close)

)

</div>

@* Scripts. *@

<script>

//Window functions.

$(document).ready(function () {

//Windows.

var inProgressCWindow = $("#inProgressCWindow");

var agingCWindow = $("#agingCWindow");

var recentCWindow = $("#recentCWindow");

var miscCWindow = $("#miscCWindow");

var allCWindow = $("#allCWindow");

$("#inProgressBtn").click(function (e) {

//Close windows.

agingCWindow.data("kendoWindow").close();

recentCWindow.data("kendoWindow").close();

miscCWindow.data("kendoWindow").close();

allCWindow.data("kendoWindow").close();

//Toggle.

if (inProgressCWindow.data("kendoWindow").element.is(":hidden")) {

inProgressCWindow.data("kendoWindow").center();

inProgressCWindow.data("kendoWindow").open();

}

else {

inProgressCWindow.data("kendoWindow").close();

};

});

//Open aging window.

$("#agingBtn").click(function (e) {

//Close windows.

inProgressCWindow.data("kendoWindow").close();

recentCWindow.data("kendoWindow").close();

miscCWindow.data("kendoWindow").close();

allCWindow.data("kendoWindow").close();

//Toggle.

if (agingCWindow.data("kendoWindow").element.is(":hidden")) {

agingCWindow.data("kendoWindow").center();

agingCWindow.data("kendoWindow").open();

}

else {

agingCWindow.data("kendoWindow").close();

};

});

//Open recent window.

$("#recentBtn").click(function (e) {

//Close windows.

inProgressCWindow.data("kendoWindow").close();

agingCWindow.data("kendoWindow").close();

miscCWindow.data("kendoWindow").close();

allCWindow.data("kendoWindow").close();

//Toggle.

if (recentCWindow.data("kendoWindow").element.is(":hidden")) {

recentCWindow.data("kendoWindow").center();

recentCWindow.data("kendoWindow").open();

}

else {

recentCWindow.data("kendoWindow").close();

};

});

//Open misc. window.

$("#miscBtn").click(function (e) {

//Close windows.

inProgressCWindow.data("kendoWindow").close();

agingCWindow.data("kendoWindow").close();

recentCWindow.data("kendoWindow").close();

allCWindow.data("kendoWindow").close();

//Toggle.

if (miscCWindow.data("kendoWindow").element.is(":hidden")) {

miscCWindow.data("kendoWindow").center();

miscCWindow.data("kendoWindow").open();

}

else {

miscCWindow.data("kendoWindow").close();

};

});

//Open all windows.

$("#allBtn").click(function (e) {

//Close windows.

inProgressCWindow.data("kendoWindow").close();

agingCWindow.data("kendoWindow").close();

recentCWindow.data("kendoWindow").close();

miscCWindow.data("kendoWindow").close();

//Toggle.

if (allCWindow.data("kendoWindow").element.is(":hidden")) {

allCWindow.data("kendoWindow").center();

allCWindow.data("kendoWindow").open();

}

else {

allCWindow.data("kendoWindow").close();

};

});

</script>

Window

answered on 06 Mar 2014

5 answers

169 views

Markers and shapeMouseLeave event

Hi,
I've noticed that when using markers on a GeoJSON map, when the mouse moves over a marker, a shapeMouseLeave event is fired for the country under the marker. This is then followed by a shapeMouseEnter event when the mouse moves away from the marker and back into the country shape.

Is there anyway of preventing these events from firing as a result of moving a mouse over a marker?

Best regards, Ian

Map

answered on 06 Mar 2014