Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"You cannot apply bindings multiple times to the same element" during traversing a DOM tree after applyBindings #1053

Closed
San4es opened this issue Jul 29, 2013 · 7 comments

Comments

@San4es
Copy link

San4es commented Jul 29, 2013

I have сustom binding handler 'overlay', which moves content into another container during the processing (see http://jsfiddle.net/San4es/ESCT4/). After calling ko.applyBindings, I get the exception: "You cannot apply bindings multiple times to the same element". I understand that the problem is related to a modification of the DOM tree during traversing by Knockout.

How can I avoid this issue? Is the problem the expected?

Thanks,
Alexander.

@stalniy
Copy link

stalniy commented Jul 29, 2013

Try to call ko.cleanNode(domNode) before ko.applyBindings

@San4es
Copy link
Author

San4es commented Jul 29, 2013

So in fact if I call cleanNode then all subscriptions will be disposed contrary to the desired result.

@stalniy
Copy link

stalniy commented Jul 29, 2013

But you get this exception just because you call applyBindings multiple times; each time when you call this method subscriptions will be recreated. So, I believe this approach should work:

ko.cleanNode(element);
ko.applyBindgings(viewModel, element);

@San4es
Copy link
Author

San4es commented Jul 29, 2013

Unfortunately, the scenario you are talking about is not my case. I don't call applyBindings several times. In my case, it is called exactly once. The problem is that the Knockout recursively traverses DOM tree, and when it encounters a node, which is processed in the same call stack, error is triggered.
This is due to the fact that knockout traverses the DOM tree by "depth-first" and when I move the processed element up the DOM hierarchy knockout meets this element once again.

@mbest
Copy link
Member

mbest commented Jul 29, 2013

Probably you can fix this by returning { controlsDescendantBindings: true } from your binding handler's init function. See http://knockoutjs.com/documentation/custom-bindings-controlling-descendant-bindings.html

@stalniy
Copy link

stalniy commented Jul 30, 2013

Oh, I understood the problem. Do you really need to move existing element somewhere else? It's a little bit strange behavior. Looks like some type of hacks. You creates instance of anonymous template engine just because you want to call nodes method. And then you call renderTemplate which also creates anonymous template object... Anyway even your solution can be fixed using one more custom binding stopBinding. You can check working example: http://jsfiddle.net/ESCT4/12/ .
Anyway I recommend to reconsider this solution it looks too complicated (I even don't understand what you want to achieve using this overlay binding. Looks like you put part of ViewModel responsibilities into View) but up to you

@SteveSanderson
Copy link
Contributor

I'll close this as it's by design (and so old that it's unlikely still to be an active concern). Please reopen if anyone disagrees!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants