IE 10 + KnockoutJS = HierarchyRequestError?

I have simplified my problem as much as possible. This only happens in Internet Explorer (9 and 10 confirmed). I have a page with this:

<html> <body> <span data-bind="text:$data[0].Mileage"></span> <script type="text/javascript"> window.initChild = function (ko, viewModel) { window.ko = ko; ko.applyBindings(viewModel, document.body); } </script> </body> </html> 

My SPA challenges

  var otherWindow = window.open('myurl', '_blank'); var handler = function () { otherWindow.initChild(ko, report); }; if (otherWindow.addEventListener) { otherWindow.addEventListener('load', handler, false); } else if (otherWindow.attachEvent) { otherWindow.attachEvent('onload', handler); } 

I checked the data goes into the initChild method.

If I bind ANYTHING on the page, I get a HierarchyRequestError in the applyBindings call. My google-fu completely left me on this, I absolutely do not know what happened.

+6
source share
1 answer

As far as I can tell, this was a sign of this problem: Using Javascript objects in separate windows in IE

basically, regardless of how I passed the ko object to the child window, something was lost, and when I tried to apply the bindings, ko myself encountered a DOM tracking error and tried to insert something in a place where it shouldn't ( , part of the parent DOM of the child DOM).

The solution was twofold:

  • Add ko (and ko.mapping) scripts to the child window to have your own ko object
  • serialize the model with ko.mapping in JSON, pass the string to the child window and deserialize it.

Horrible behavior, IE ...

If anyone can come up with an actual explanation of WHY this is happening, I will accept his answer.

+3
source

Source: https://habr.com/ru/post/951401/


All Articles