Hi,
I found exception thrown if a DataViz widget is included in a validation div. The error thrown is:
I tracked the source code: line 11448 in kendo.all.js:
For the SVG object representing chart, element.className does not have method of "indexOf".
I changed it to this to avoid the issue:
Here is my test page (modified from online demo), also attached.
Regards,
Gong
I found exception thrown if a DataViz widget is included in a validation div. The error thrown is:
Uncaught TypeError: Object #<SVGAnimatedString> has no method 'indexOf'if (element.className.indexOf(INVALIDMSG) > -1) {I changed it to this to avoid the issue:
if (element.className.indexOf && element.className.indexOf(INVALIDMSG) > -1) {<!DOCTYPE html><html><head> <title>Kendo UI Chart with Input Validation Issue</title> <meta charset="UTF-8"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css"> <link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.default.min.css"></head><body> <div id="example" class="k-content"> <div class="chart-wrapper"> <div id="chart"></div> </div> <label for="name">Name: </label> <input type="text" id="name" required /> <span class="k-invalid-msg" data-for="name"></span> <button id="test">Test</button> </div> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.web.min.js"></script> <script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.dataviz.min.js"></script> <script> (function($){ function createChart() { $("#chart").kendoChart({ title: { text: "Site Visitors Stats /thousands/" }, legend: { visible: false }, seriesDefaults: { type: "bar" }, series: [{ name: "Total Visits", data: [56000, 63000, 74000, 91000, 117000, 138000] }, { name: "Unique visitors", data: [52000, 34000, 23000, 48000, 67000, 83000] }], valueAxis: { max: 140000, line: { visible: false }, minorGridLines: { visible: true } }, categoryAxis: { categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun"], majorGridLines: { visible: false } }, tooltip: { visible: true, template: "#= series.name #: #= value #" } }); } $(document).ready(function(){ var validator = $('#example').kendoValidator().data('kendoValidator'); createChart(); $(document).bind("kendo:skinChange", createChart); $('#test').on('click', function(e){ alert('validation: ' + validator.validate()); }); }); })(jQuery); </script> <style scoped> .chart-wrapper, .chart-wrapper .k-chart { height: 350px; } </style></body></html>Regards,
Gong
1 Answer, 1 is accepted
0
Hello,
T. Tsonev
Telerik
Thank you for taking the time to report isolate this problem.
It turns out that it was reported earlier and it is already fixed in our internal builds. The fix will also be included in the upcoming Service Pack release in mid-September.
Apologies for the caused inconvenience.
T. Tsonev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!