question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

"Uncaught Error: ko.cleanNode: An already cleaned node was removed from the document" after upgrade 1.1

See original GitHub issue

Hello,

After upgrade from last rc to 1.1 rtm custom control (bootstrap-select) not working.

Its similar in dotvvm contrib repo.

ko.bindingHandlers["bootstrap-select"] = {
  init: function (element, valueAccessor, allBindingsAccessor) {
    $(element).addClass('selectpicker').selectpicker({
      width: '100%',
      actionsBox:true,
      liveSearch: true,
      showSubtext: true,
      selectedTextFormat: 'count'
    });

    var refreshHandler = function () {
      $(element).selectpicker('refresh');
    };

    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
      $(element).selectpicker('destroy');
    });
    dotvvm.events.afterPostback.subscribe(refreshHandler);
  },
  update: function (element, valueAccessor, allBindingsAccessor) {
    if ($(element).is('select')) {
      var selectPickerOptions = allBindingsAccessor().selectPickerOptions;
      if (typeof selectPickerOptions !== 'undefined' && selectPickerOptions !== null) {
        $(element).prop('disabled', selectPickerOptions.isDisabled());
        if (selectPickerOptions.title) {
          $(element).prop('title', selectPickerOptions.title());
        }
      }
      if (ko.isObservable(valueAccessor())) {
        if ($(element).prop('multiple') && $.isArray(ko.utils.unwrapObservable(valueAccessor()))) {
          ko.bindingHandlers.selectedOptions.update(element, valueAccessor);
        } else {
          ko.bindingHandlers.value.update(element, valueAccessor);
        }
      }
      $(element).selectpicker('refresh');
    }
  }
};

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:8 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
djanosikcommented, Mar 9, 2017

Ok, I have some good and some bad news.

Good news:

  • Knockout cleans the element and all of its descendants
  • It also calls jQuery’s cleanData which frees all event handlers and other data
  • We don’t need to care about this in BusinessPack

Bad news:

  • bootstrap-select also removes some other elements in it’s destroy method that are not descendants of the element. They will not get cleaned-up properly if you don’t call the destroy method.

@martinsura You may need to clean-up some elements yourself.

0reactions
tomashercegcommented, Apr 9, 2017

Closing because there is no reasonable way to solve this on DotVVM side. We need the newest Knockout version and removing the cleanNode check would cause another issued.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Knockout.js's cleanNode does not unbind events
But this answer says cleanNode is the incorrect solution due to cleanNode being knockout's internal cleanup. It doesn't clean up event handlers ...
Read more >
ko.cleanNode() not working correctly on foreach · Issue #912
Foreach duplicating after calling cleanNode is a clear sign that the ressources are not cleaned up. Unfortuantely I do not get the jsfiddle...
Read more >
The ko.cleanNode method does not remove widgets from ...
cleanNode and apply a new model I get the following error: Uncaught TypeError: Unable to process binding "dxValidationGroup: function ...
Read more >
knockout-2.3.0.debug always throwing "You cannot apply ...
There is not a way to fully remove bindings, but ko.cleanNode is the closest and will prevent the error. -- Michael.
Read more >
Custom disposal logic
When creating a custom binding, it is often desirable to add clean-up logic ... To register a function to run when a node...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found