or
1 answer
94 views
Is possible store to database when click the chart and then showing them on chart ?
Georgi Denchev
Telerik team
answered
on
25 Aug 2023
1 answer
415 views
After Implmenting the Content Security Policy (CSP) in our application, various Kendo controls have stopped working. The CSP, blocks execution of inline scripts and since the Kendo controls are creating scripts while they render, CSP finds it as a threat and hence blocks its execution.
Below is a snapshot of the browser console error. All of the 5 errors are being thrown by kendo Controls.
When the Kendo Control, such as a grid, is rendered, a script tag is generated. Please check the below screenshot for reference.
Here, we have a grid, divIFAResults, when it is rendered on the screen, a script tag with Kendo.syncReady() is generated. The Kendo Grid relies on this script for its smooth execution, but our CSP blocks this script, inturn making the control unusable.
We have added 'unsafe-eval' as per the telerik docs for CSP. We are using the Kendo files hosted in our own project, not from CDN.
Georgi Denchev
Telerik team
answered
on
25 Aug 2023
1 answer
130 views
http://dojo.telerik.com/aGisuSuR/2
I am trying to hide and show error bar on a Kendo line chart based on when the mouse is over the line point, is it possible to do this? I tried using highlight, I can probably create a visual, but I just wanted to hide all the error bars and show only when the point is highlighted. I tried to set erroBar visibility false and set it to true on Highlight, that doesn't seem to work. Even if this worked, this would set the visibility of all error bars?, I just want to set it for only one point at a time, as showing all at once is will overlap error bars.
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/line-charts/remote-data-binding">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.default.min.css" />
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.default.mobile.min.css" />
<script src="https://kendo.cdn.telerik.com/2017.1.118/js/jquery.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example">
<div class="demo-section k-content wide">
<div id="chart"></div>
</div>
<script>
function createChart() {
var StrokeAnimation = kendo.drawing.Animation.extend({
init: function(element) {
kendo.drawing.Animation.fn.init.call(this);
this.initialStroke = $.extend({}, element.options.stroke);
this.color = element.options.fill.color;
this.element = element;
},
step: function(pos) {
this.element.stroke(this.color, this.initialStroke.width * pos * 5, 0.5);
},
reset: function() {
this.element.options.set("stroke", this.initialStroke);
}
});
$("#chart").kendoChart({
dataSource: [
{
"country": "Spain",
"year": "2008",
"unit": "GWh",
"solar": 2578,
"hydro": 26112,
"wind": 32203,
"nuclear": 58973,
"low":51000,
"high":68000
},
{
"country": "Spain",
"year": "2007",
"unit": "GWh",
"solar": 508,
"hydro": 30522,
"wind": 27568,
"nuclear": 55103,
"low":52000,
"high":60000
},
],
title: {
text: "Spain electricity production (GWh)"
},
legend: {
position: "top"
},
seriesDefaults: {
type: "line",
errorLowField: "low",
errorHighField: "high",
errorBars: {
highlight:{
line: {
width: 1,
dashType: "solid"
}
},
visible: true,
endCaps: true,
width: 10,
color: "darkblue",
line: {
width: 1,
dashType: "solid"
}
},
highlight: {
errorBars: {
line: {
width: 1,
dashType: "solid"
}
}
}
},
series: [{
field: "nuclear",
name: "Nuclear"
}, {
field: "hydro",
name: "Hydro"
}, {
field: "wind",
name: "Wind"
}],
categoryAxis: {
field: "year",
labels: {
rotation: -90
},
crosshair: {
visible: false
}
},
valueAxis: {
labels: {
format: "N0"
},
majorUnit: 10000
},
tooltip: {
visible: false,
shared: false,
format: "N0"
},
render: function(e) {
}
});
}
$(document).ready(createChart);
$(document).bind("kendo:skinChange", createChart);
</script>
</div>
</body>
</html>
Neli
Telerik team
answered
on
24 Aug 2023
1 answer
409 views
As the subject says, I'm looking for the recommended way to clone existing DateTimePicker controls at run time so that users can create as many controls as are necessary.
Our application allows users to clone rows of data that contain both DatePickers and DateTimePickers. We recently upgraded from a previous version of Kendo UI to 2022.3.1109 and now the code that used to work does not.
If we don't execute the following, the look and feel is correct (but nothing happens when either the date or time controls are clicked):
If we do execute the above, the control appears as shown in the second row below...
...and the following error appears in the console:
I am able to create cloned fields if I write the appropriate HTML from scratch (e.g., embed a constant in the JavaScript function), but there's other logic that's fired that we need to take care of so that's not optimal.
I've also tried getting the options from the original control and applying them to the cloned control, but that also doesn't work, nor does attempting to destroy the control via $("#controlName").data("kendoDateTimePicker").destroy(). (My guess is that the underlying Kendo logic doesn't know about the cloned controls so the calls fail.)
Any help on what the best practice is would be greatly appreciated!
Georgi Denchev
Telerik team
answered
on
24 Aug 2023
1 answer
218 views
Hi,
I'm doing a quite simple implementation of saveAsPdf() for a grid. The actual PDF is fine, but the MetaData is a problem.
The PDF MetaData attributes for title, subject, keywords, author, creator and producer all contain strange/escape characters.
Here is an example of what I get every time.
Title: þÿ�M�o�d�e�l� �2�0�2�3
Subject: þÿ
Keywords: þÿ
Author: þÿ
Creator: þÿ�K�e�n�d�o� �U�I� �P�D�F� �G�e�n�e�r�a�t�o�r
Producer: þÿ�K�e�n�d�o� �U�I� �P�D�F� �G�e�n�e�r�a�t�o�r
The only one of these attributes I'm actually setting is the Title. The rest are just whatever is deemed a default value (I assume).
This happens when I produce the PDF from Chrome, Firefox or Edge.
Here's an example of the PDF Options I am using.
{
"title": "Model 2023",
"fileName": "Model2023.pdf",
"allPages": false,
"avoidLinks": true,
"paperSize": "A4",
"margin": {
"left": "1cm",
"top": "1cm",
"right": "1cm",
"bottom": "1cm"
},
"scale": 0.4,
"landscape": true,
"multiPage": true,
"repeatHeaders": true
}I have tried multiPage as true and false, which made no difference. I have included pako_deflate. I thought it might be a font issue, but it's MetaData. Not what's actually output on the PDF.
To make it even more confusing for me, your demo works perfectly. :)
FYI: Using version: 2022.3.913
If you can offer any ideas, I'd be grateful.
Thanks
John
1 answer
327 views
Hi,
I would like to implement the subresource integrity check on the scripts and stylesheets which are brought in from the Kendo CDN. However I wanted to check something first. I have added the scripts based on this guide https://docs.telerik.com/kendo-ui/intro/installation/cdn-service. However there are no integrity hashes for the files. Are these available anywhere? If not I can generate them from the files manually, but this won't work if the scripts are ever modified.
Are the scripts ever changed once deployed in a version? Does every server in the CDN deliver always the exact same bytes for the file?
Many thanks,
Bill
Martin
Telerik team
answered
on
24 Aug 2023
3 answers
158 views
Charts is not shown on JSP Page..Empty div is shown.why????
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="kendo" uri="http://www.kendoui.com/jsp/tags"%>
<%@page isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
<link href="resources/styles/kendo.default-main.css" rel="stylesheet" type="text/css" />
<link href="resources/styles/kendo.common-min.css" rel="stylesheet" type="text/css" />
<link href="resources/styles/bootstrap-main.css" rel="stylesheet" type="text/css" />
<script src="resources/js/jquery.min.js"></script>
<script src="resources/js/kendo.web.min.js"></script>
<meta charset="ISO-8859-1">
<title>Kando Charts Example</title>
</head>
<body>
<h2>Charts</h2>
<div id="chart">hello</div>
<script>
$("#chart").kendoChart({
title: {
text: "Gross domestic product growth /GDP annual %/"
},
legend: {
position: "top"
},
series: [{
name: "India",
type: "column",
data: [3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.890, 8.238, 9.552, 6.855],
color: "red"
},{
name: "Germany",
type: "column",
data: [1.010, 1.375, 1.161, 1.684, 3.7, 3.269, 1.083, 5.127, 3.690, 2.995],
color: "blue"
},{
name: "World",
type: "line",
data: [1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, 2.245, 4.339, 2.727],
color: "green"
}],
categoryAxis: {
categories: [2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011]
},
valueAxis: {
labels: {
format: "{0}%"
}
},
tooltip: {
visible: true,
template: "#= series.name #: #= value #%"
}
});
</script>
</body>
</html>
Zornitsa
Telerik team
answered
on
23 Aug 2023
1 answer
172 views
(Before getting into the article, I apologize for my poor English skills.)
Hello! you guys always help me.
I need to create checkboxes using kendoCheckBoxGroup function in specific fields of KendoForm.
However, it should be limited to 4 per line, not listed in one line.
Expressing it pictorially is as follows:
(Note, the text that goes into the field will vary in length.)
And, the code I'm working on is below.
var items = [
{value: "item1", label: "Item 1"},
{value: "item2", label: "Item 2"},
{value: "item3", label: "Item 3"},
...
{value: "item14", label: "Item 14"},
];
$('#checkBoxField').kendoCheckBoxGroup({
items: items,
layout: "horizontal"
});How can I modify it to make it work the way I want?
Thank you as always for your kindness!
Zornitsa
Telerik team
answered
on
22 Aug 2023
1 answer
556 views
I'm using the kendo editor tool for a rich text editor, and I want to change the default font family. No matter what I do (I've tried accessing the HTML element by jQuery and DOM selectors and change its value), the selected font stays "inherited font" option, what should I do? (Same goes for "inherited size", for the font size)
Zornitsa
Telerik team
answered
on
21 Aug 2023
0 answers
456 views
Hi
I've been playing around with the barcodes widget and I've noticed some confusing behaviour on the examples available.
I initially used the cheese example with some valid barcodes and noticed that entering an EAN13 in its full 13 digits causes an error and fails to show any barcodes. Using https://demos.telerik.com/kendo-ui/barcode/index if you change the code for the first item (Manchego) and change it to EAN13 and then enter a valid EAN13 (eg 9300657234720) it not only shows no barcode but also obliterates all of the following barcodes. If you remove the check digit (the last digit) then everything works.
I then found the API example https://demos.telerik.com/kendo-ui/barcode/api where I worked out what is happening. The Kendo widget is accepting ONLY the first 12 digits and then calculating the check digit for itself. So entering
930065723472
will generate a valid barcode and will correctly calculate the check sum as 0.
However this means that the security of the checksum is stripped out meaning that if an end user manually types the example
9300657234720
without the checksum so
930065723472
but makes a transposition error with the last 7 with the last 4 to
930065723742
then it will still generate a valid barcode
930065723742 4
However the original barcode is for baked beans and the erroneously created barcode does not exist as a product.
Further if the original barcode is checked in its entirety but has the transposition error with the 4 and the 7 with the checksum 0 then this error would be caught https://barcode.tec-it.com/en/EAN13?data=9300657237420
So, my question is how do I use the Barcode widget and a full EAN13 with check digit to ensure that data entered is correct and that the barcode being generated is for baked beans not non existent products?
