Questions on Kendo UI for jQuery Forum

1 answer

691 views

SaveAsPDF from opening the result while forcing a proxy

When I use the Editor's proxy feature and 'force proxy' to true i cannot seem to prevent the response from being opened into a new tab or window. I would like this to simply save off the PDF and NOT open it in any way. I presumed that this would be possible by using the proxyTarget and referencing an invisible I-Frame but I have not been able to successfully pull this off. Any thoughts?

<script>

$("#TestEditor").kendoEditor({

tools: [],

pdf: {

allPages: true,

proxyURL: 'dynamic',

paperSize: "Letter",

margin: { top: "2cm", left: "1cm", right: "1cm", bottom: "1cm" },

fileName: "Test.pdf",

forceProxy: true,

proxyTarget: "_blank"

}

});

function MakeMeAPdf() {

var $editor = $("#TestEditor").getKendoEditor();

$editor.value("<div>Some HTML stored for the editor</div>");

$editor.options.pdf.proxyURL = 'http://The.Url.To.com/my_proxy';

$editor.saveAsPDF();

}

</script>

Editor

answered on 15 Nov 2019

7 answers

835 views

kendo grid: frozen column template must fill cell when other grid columns have text-wrap

I have a kendo grid that has a frozen column with a custom template. One of the other columns in the grid can have a large amount of text that wraps, causing the row height to grow. When this happens, I want the template in the frozen column to grow to fill the entire cell (both height and width)

I have created a dojo to illustrate the issue: here

The entire cell in the frozen column must have a blue background. Currently the div holding the custom template is only as high as its content.

I know that height:100% on the div doesn't work, because the parent element doesn't have a fixed height, but I can't give the parent a fixed height as the row's height must be determined by the content of the cell in the row with the most data (in this case the details cell)

Another complication is that the grid is groupable, so we must be able to group by category without breaking the layout of the grid. The frozen cell's div must still fill it's cell and the row height must still be determined by the cell with the most content.

Thanks for your help.

Grid

answered on 15 Nov 2019

1 answer

112 views

Persist connection connector point

Is there a way to persist the connection connector point?

In this example only the connections are saved: https://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/diagram/how-to/persist-shape-properties .

The points (connector) where the connections are attached are not persisted.

Diagram

answered on 15 Nov 2019

2 answers

155 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

126 views

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

Date/Time Pickers

answered on 13 Nov 2019

1 answer

756 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

133 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

84 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