"SCRIPT16386: No such interface supported" when calling splice on array

3 posts, 0 answers
  1. Ovidiu
    Ovidiu avatar
    7 posts
    Member since:
    Mar 2013

    Posted 19 Aug 2013 Link to this post

    Hi,

    I have an observable object that contains an array which is binded as a source to a div:
    <div data-bind="source: Fields" data-template="field-template"></div>
    where field-template looks like this:
    <script id="field-template" type="text/x-kendo-template">
       <div>
          <div data-bind="text: FieldName"></div>
          <button data-bind="events: { click: removeField }">Remove</button>
       </div>
    </script>
    When I try to remove an element from an array by calling splice, kendo.web.js breaks in IE at line 6753. Apparently I would say the problem is at the source binding because at the specified line, element.children.length is 0 but this happens only in IE. In Chrome and Firefox element.children contains template instances for each element from the array. Why Internet Explorer breaks?

    The MV looks as follows:
    var SectionVM = function (section) {
        var self = this;
        this.Fields = [];
     
        if (section.Fields) {
            var fieldIndex = 0;
            $.each(section.Fields, function () {
                var field = this;
                var fvm = new FieldVM(field); // FieldVM is similar with this VM
                self.Fields.push(fvm);
            });
        }
     
        this.removeField = function (e) {
               var FieldIndex = self.get("Fields").indexOf(e.data);
            var removedItem = self.get("Fields").splice(FieldIndex, 1);
        }
         
        self = kendo.observable(this);
         
        return self;
    }
    and finally the binding:
    var secVM = new SectionVM(someSection); // someSection it's an object comming from the server and matches the VM structure
    kendo.bind($(".section"), secVM); // .section is a div wrapping the div with the source binding
    Thank you!
    <script id="field-template" type="text/x-kendo-template"><br>        <div><br>            <div data-bind="text: FieldName"></div><br>            <div><br>                  <button data-bind="events: { click: removeField }">Remove</button><br>                </div><br>            </div><br></script>

    <script id="field-template" type="text/x-kendo-template"><br>        <div><br>            <div data-bind="text: FieldName"></div><br>            <div><br>                  <button data-bind="events: { click: removeField }">Remove</button><br>                </div><br>            </div><br></script>

  2. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2289 posts

    Posted 21 Aug 2013 Link to this post

    Hello Ovidiu,

    I've tried to reproduce the error in the following sample, but with no success. Can you modify it so that the error manifests itself: http://jsbin.com/itAh/1/edit

    Things that might help us pin-point the issue:
     - IE version that you are testing
     - Kendo UI version that you are using

    Regards,
    Nikolay Rusev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Ovidiu
    Ovidiu avatar
    7 posts
    Member since:
    Mar 2013

    Posted 21 Oct 2013 Link to this post

    Hello Nikolay,

    After we did an update of the Kendo, we were not able to reproduce this issue anymore.
Back to Top