Questions on Kendo UI for jQuery Forum

6 answers

698 views

onDataBound

How can I tell in event onDataBound if the chart has bound to any data? I would like to display a "No data available" message.

Charts

answered on 21 Apr 2021

1 answer

918 views

kendo.tooltip - Uncaught TypeError: Cannot read property 'split' of undefined

There is a code snippet in the _removeDescribedBy method

arrayAttr = target.attr (DESCRIBEDBY) .split ('')

In a specific, unknown situation, undefined is returned from the attr method, which generates an error with the following content:
Uncaught TypeError: Cannot read property 'split' of undefined

The solution is simple:

arrayAttr = (target.attr (DESCRIBEDBY) || '') .split ('')

Is it possible for the next version of kendo.ui to appear in all places where such a fragment of the code is protected against unedfined?

ToolTip

answered on 21 Apr 2021

2 answers

2.5K+ views

Update selected rows column throws Cannot read property 'set' of undefined

When running the code below, the first selected row updates but the next one throws a "Cannot read property 'set' of undefined".

I have the datasource batch set to true and am using dataItem for each selected row and setting the value from there.

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

var selectedRows = grid.select();

if (selectedRows.length > 0 && unit != "") {

$.each(selectedRows, function (i, row) {

var data = grid.dataItem(row);

data.set('UnitsInStock', unit);

});

grid.saveChanges();

}

Here is a dojo sample of it http://dojo.telerik.com/aFIwuYUs

Grid

answered on 20 Apr 2021

1 answer

488 views

Kendo Tooltip position with DatePicker

Hello,

please check this example: https://dojo.telerik.com/EVEToriY

When tooltip is used with DatePicker, it shows over picker icon. Is there any way how to display it next to icon and not next to input?

I know I can use offset property to move it, but it is little hack for me.

Regards

René

ToolTip

answered on 20 Apr 2021

11 answers

5.8K+ views

Column readonly in edit mode but editable in add mode?

Hi,
I have a Kendo UI grid where the first column is readyonly:




schema: {
    data: "data",
    model: {
        id: "ID",
        fields: {
            firstName: { editable: false },
            lastName: { validation: { required: {message: "Must not be empty!"}} }
        }
    }
},



In edit mode this is just fine, but if I want to add a new row/item then of course the firstName should be editable.

How I can get this working?



I tried to find a 'best practice' but seems to be not so easy.

Is there any 'best practice'?



Thanks a lot!

Grid

answered on 20 Apr 2021

2 answers

106 views

is it possible to configure grid using Or statement for multi-columns filtering?

basically right now grid using AND when filter column1 and column2 and column3, is it possible to change the filter logic to OR?

Grid

answered on 20 Apr 2021

4 answers

3.8K+ views

Setting the default filter operator?

How do I set the default filter operator in a grid?

I define my operators in the following way, and the default operator is Is Equal To. I would like to have Contains as my default operator.

filterable: {

extra: false, //do not show extra filters

operators: { // redefine the string operators

string: {

contains: "Contains",

startswith: "Starts With",

eq: "Is Equal To"

}

Grid

answered on 20 Apr 2021

7 answers

311 views

Invalid PDF created when using Material Design Icon

Hi,

I have a problem when exporting a pdf where the element being exported contained a Material Design Icon. The PDF is invalid and does not display correctly in Adobe Reader.

I check the validity here https://www.pdf-online.com/osa/validate.aspx

The PDF does render correctly in Chrome PDF viewer though.

Any suggestions as to why?

<html>
<head>
<meta charset="utf-8" />
<title>Getting Started with Kendo UI for jQuery</title>

<link href="https://kendo.cdn.telerik.com/2021.1.330/styles/kendo.common.min.css" rel="stylesheet" />
<link href="https://kendo.cdn.telerik.com/2021.1.330/styles/kendo.default.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@5.9.55/css/materialdesignicons.min.css" />
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2021.1.330/js/kendo.all.min.js"></script>
</head>
<body>

<p>Hello <a href="https://docs.telerik.com/kendo-ui/intro/first-steps">Kendo UI for jQuery</a>!
This is version <strong id="kendoVersion"></strong>.</p>

<script>

$(function() {

$("#kendoVersion").text(kendo.version);

});

</script>

<script>
kendo.pdf.defineFont({
"Material Design Icons": "https://cdn.jsdelivr.net/npm/@mdi/font@5.9.55/fonts/materialdesignicons-webfont.ttf"
});
</script>
<script type="text/javascript">
var generatePDF = function () {
kendo.drawing.drawDOM("#PdfPrintTest", {
paperSize: 'auto',
margin: { left: "1cm", top: "1cm", right: "1cm", bottom: "1cm" }
}).then(function (group) {
kendo.drawing.pdf.saveAs(group, "test.pdf")
});
};
</script>
<button onclick="generatePDF();">Download</button>
<div id="PdfPrintTest">
Bob lives in a <span class="mdi mdi-grass"></span>. and he likes it a lot
</div>

</body>
</html>

General Discussions

answered on 20 Apr 2021

1 answer

477 views

Notifications not stacking

Hi team,

I'm trying to setup notifications on my project, using your demo : https://demos.telerik.com/kendo-ui/notification/templates. I managed to make notifications appears like in your tutorial, but they are not stacking when multiple of them are open in the same time.

Here's my code :

function showNotification(_title, _txt, _type) {

var notification = $("#notificationPopup").kendoNotification({

position: {

pinned: true,

top: 30,

right: 30

},

autoHideAfter: 0,

stacking: "down",

templates: [{

type: "success",