Questions on Kendo UI for jQuery Forum

2 answers

189 views

Problem with Source Binding to Arrays of Primitive Objects

Here is the original article from Kendo UI about binding to arrays of primitive objects: https://docs.telerik.com/kendo-ui/framework/mvvm/bindings/source#source-binding-to-arrays-of-primitive-objects

In my project I need to work with an array of strings as the values of input elements. And I was wondering if anyone knows why it's not possible to use the following template:

<script id="ul-template" type="text/x-kendo-template">

<li>

<input type="text" data-bind="value: this" />

<a class="k-button textButton" title="Remove" data-bind="events: { click: removeValue }" href="\\#"><span class="k-icon k-i-close"></span></a>

</li>

</script>

Instead of the one, provided in their docs:

<script id="ul-template" type="text/x-kendo-template">

<li data-bind="text: this"></li>

</script>

Whatever I tried it simply doesn't list the elements above with the primitive data like [ "Coffee", "Tea", "Juice" ], but it works if there are objects instead of simple strings like [ {product: "Coffee"}, {product: "Tea"}, {product: "Juice"} ], which is not preferable solution in my case.

For your convenience I created the sample of what I need in DOJO, here is the URL: https://dojo.telerik.com/uWEdIroR/3

What am I doing wrong? Thanks in advance.

MVVM

answered on 14 Nov 2019

5 answers

178 views

[Solved] DatePicker initialy shows today's date wihtout setting a value

I just updated my application to use version 2019.3.1023. While testing I noticed that all DatePicker's are displayed whit today's date by default without setting a value. Is this by design?

Kind Regards,

Marco

DatePicker

answered on 13 Nov 2019

1 answer

845 views

How can I edit cells on double-click in an editable Grid when selection is enabled?

Hi i am evaluating the grid for a development.
One of the requirements i have is to have a multi row selection and inline edit. (will be going into cell inline mode on double click)
I found this great article of yours
https://github.com/telerik/kendo-ui-core/blob/master/docs/knowledge-base/grid-edit-cell-on-double-click.md
where it looked it was exactly what i was looking for but it looks like that when there is a numeric editor it doesnt work. I double click the cell, the editor appears and immediately hides, i have updated one of your grid examples (the editing-custom.html) and attached it.
Would be great to have some feedback on it, to have a proper evaluation as this is a must have.
As i cant attach neither hmtl nor txt files (being blocked by the page)

################################################################################

Here is the code:

<!DOCTYPE html>
<html>
<head>
<title>Editing custom editor</title>
<meta charset="utf-8">
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
<link href="../../styles/kendo.common.min.css" rel="stylesheet">
<link href="../../styles/kendo.rtl.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.min.css" rel="stylesheet">
<link href="../../styles/kendo.default.mobile.min.css" rel="stylesheet">
<script src="../../js/jquery.min.js"></script>
<script src="../../js/jszip.min.js"></script>
<script src="../../js/kendo.all.min.js"></script>
<script src="../content/shared/js/console.js"></script>
<script>

</script>


</head>
<body>

<a class="offline-button" href="../index.html">Back</a>

<script src="../content/shared/js/products.js"></script>
<div id="example">
<div id="grid"></div>

<script>

$(document).ready(function () {
var dataSource = new kendo.data.DataSource({
pageSize: 20,
data: products,
autoSync: true,
schema: {
model: {
id: "ProductID",
fields: {
ProductID: { editable: false, nullable: true },
ProductName: { validation: { required: true } },
Category: { defaultValue: { CategoryID: 1, CategoryName: "Beverages"} },
UnitPrice: { type: "number", validation: { required: true, min: 1} }
}
}
}
});

$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 550,
toolbar: ["create"],
columns: [
{ field:"ProductName",title:"Product Name" },
{ field: "Category", title: "Category", width: "180px", editor: categoryDropDownEditor, template: "#=Category.CategoryName#" },
{ field: "UnitPrice", title:"Unit Price", format: "{0:c}", width: "130px" },
{ command: "destroy", title: " ", width: "150px" }],
// editable: false,
selectable: "multiple"
});

$("#grid tbody").on("dblclick", "td", function(e) {

var cellElement = this;
var cell = $(cellElement);
var grid = $("#grid").getKendoGrid();
grid.editCell(cell);
});

$("#grid tbody").on("blur", "td", function(e) {
var cellElement = this;
var cell = $(cellElement);
var grid = $("#grid").getKendoGrid();
grid.closeCell(cell);
});
});

function categoryDropDownEditor(container, options) {
$('<input required name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataTextField: "CategoryName",
dataValueField: "CategoryID",
dataSource: {
type: "odata",
transport: {
read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Categories"
}
}
});
}



</script>
</div>


</body>
</html>

Grid

answered on 13 Nov 2019

1 answer

177 views

How can I edit cells on double-click in an editable Grid when selection is enabled?

Hi i am evaluating the grid for a development.

One of the requirements i have is to have a multi row selection and inline edit. (will be going into cell inline mode on double click)

I found this great article of yours

https://github.com/telerik/kendo-ui-core/blob/master/docs/knowledge-base/grid-edit-cell-on-double-click.md

where it looked it was exactly what i was looking for but it looks like that when there is a numeric editor it doesnt work. I double click the cell, the editor appears and immediately hides, i have updated one of your grid examples (the editing-custom.html) and attached it.

Would be great to have some feedback on it, to have a proper evaluation as this is a must have.

Kind regards,

Grid

answered on 13 Nov 2019

1 answer

149 views

Set Index

I would like to persist the order of cards moved around by the user for the next time they open the page or window. Is it possible to do this by somehow setting the index of these DIV tag cards inside their sortable container?

Sortable

answered on 13 Nov 2019

2 answers

302 views

Add new Field in the popup

Hi,

I would like to add a new field in the popup.

For example, there is the fields Title, Start, End, Complete, I'm trying to add a new field Project Number.

Can you suggest me some documentation about it?

Gantt

answered on 12 Nov 2019

6 answers

475 views

Export to JSON

Can i export my diagram and all the data inside him to a formatted json model ?

Diagram

answered on 08 Nov 2019

1 answer

350 views

Bubble Chart tooltip Autohide

Currently I have a bubble chart that I am using tooltips to display some more information about the bubble. I need the tool tip to stay visible while a user clicks a button to export the chart as an image. I have set the autoHide attribute to false, but it does not seem to have any effect. My tooltip does not get a close button. My chart configuration looks like this:

series: [{
type: "bubble",
xField: "CurrentLossEstUSD",
yField: "CurrentScore",
sizeField: "MFL_TOTAL",
color: "#dadfe1",
tooltip: {
visible: true,
format: "{3}: MFL - {2:N0}",
autoHide: false
},

}]

Thanks.

Charts

answered on 08 Nov 2019

5 answers

303 views

Auto zoom function?

Hello,

I was just wondering if there is a way to make the map always show the same extent, regardless
of the size of the <div> element containing it?

Something like an auto zoom function so the map always shows the same area?

Best regards

Map

answered on 08 Nov 2019

1 answer

378 views

[Solved] Get Scheduler timeslot on kendoDropTarget

In searching this forum I came across this post from 2013.... https://www.telerik.com/forums/get-scheduler-timeslot-on-kendodroptarget

It mentions that this may be implemented in a future release. I've not found any information that indicates this is possible. I'm looking at placing a series of div objects that represent different types of events (work, lunch, meeting, day-off etc) along side a Scheduler. A user will drag and drop a div onto a scheduler and that will create a scheduler event in the slot it was dropped onto. Is this possible?

Thanks

Drag and Drop

answered on 08 Nov 2019