[Bug Report] 2013.2.716 DataViz widgits cause exception on input validation

2 posts, 0 answers
  1. Lei
    Lei avatar
    4 posts
    Member since:
    Nov 2012

    Posted 27 Aug 2013 Link to this post


    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'
    I tracked the source code: line 11448 in kendo.all.js:
    if (element.className.indexOf(INVALIDMSG) > -1) {
    For the SVG object representing chart, element.className does not have method of "indexOf".

    I changed it to this to avoid the issue:
    if (element.className.indexOf && element.className.indexOf(INVALIDMSG) > -1) {
    Here is my test page (modified from online demo), also attached.
    <!DOCTYPE html>
        <title>Kendo UI Chart with Input Validation Issue</title>
        <meta charset="UTF-8">
        <div id="example" class="k-content">
            <div class="chart-wrapper">
                <div id="chart"></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>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
                function createChart() {
                        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 #"
                    var validator = $('#example').kendoValidator().data('kendoValidator');
                    $(document).bind("kendo:skinChange", createChart);
                    $('#test').on('click', function(e){
                        alert('validation: ' + validator.validate());
        <style scoped>
            .chart-wrapper, .chart-wrapper .k-chart {
                height: 350px;


  2. T. Tsonev
    T. Tsonev avatar
    2834 posts

    Posted 28 Aug 2013 Link to this post


    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
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top