It is not possible to rebind ViewModel when using internal foreach templates?

[Pekka Ylenius]

Hi,

I have my ViewModel specified on server side and I'm using mapping plugin to generate ViewModel for Knockout. That is why it is not easy for me to update new values to page without rebinding whole page.

After user clicks save I would like to to rebind whole page without reloading.

This works fine when binding everything else but lists and using jQuery templates for lists.

Is there any possibility to make rebinding work? Or can I somehow clean old binding before rebinding?

Now rebinding (not)works bit differently for all browsers.

[Michael Best]

"Re-binding" using a second applyBinding call isn't supported. But you
can wrap your view model in an observable and update it to "re-bind"

-- Michael

[stoneym]

Based on the large number of app scenarios that depend on new data
being available to the client without a reload, it surprises me that
ko doesn't support this. Even when I make certain portions of my
viewmodel observable so they can be replaced with the new data, side
effects abound. This is disappointing.

My main scenario is a search page that allows the user to search as
many times as they choose with different criteria and rendering the
results in a foreach. No combination of re-binding or not, or
observable or not, seems to get the desired results. I'll be posting
a jsFiddle later to demonstrate the issue and hope that someone can
show me the recommended way to handle the scenario.

My only fix that works is to clone any node with a foreach and keep it
as a clean template and shove a copy back in the dom every time the
data needs to change and be bound again. This way I am always binding
clean markup.

I vote for allowing things to be rebound as many times as we want. I
may branch ko and introduce the capability myself if someone wants to
point me to why the support isn't there in the first place.

Thanks,
Stoney

[Casey Corcoran]

Not exactly sure what you're looking for but what I use (and works
great) for "fragments" is to use an observable object as a "provider"
to the template binding. That allows me to utilize sub-view and
sub-viewmodels very easily and efficiently.

Basically it goes like this:

<div data-bind="template:myModule"></div>

var mainViewModel = {
myModule: ko.observable({}),
setModule: function( templateName, viewModel ) {
this.myModule({
name: templateName,
data: viewModel,
afterRender: viewModel.transitionIn
});
}
}

var subViewModel = {
foo: "bar",
transitionIn: function() {
console.log("transitionIn()");
}
}

ko.applyBindings(mainViewModel);

mainViewModel.setModule("myTemplate",subViewModel);

[Michael Best]

The 'with' binding is designed to do exactly that. Have you tried it?

[Domenic Denicola]

Respectfully, this is horrible. Please at least throw a very loud error saying this is not supported. We've wasted a couple days before narrowing it down to a few unfortunate failing test cases:

http://jsfiddle.net/QXJVb/1/
http://jsfiddle.net/QXJVb/2/

This is really unfortunate and will force us to build a layer on top of Knockout that wraps every view model in a fake view model containing a single observable that can then be replaced for re-binding purposes.

Is there a GitHub issue for this we can vote on?

[Michael Best]

These are the related issues that I've opened:

https://github.com/SteveSanderson/knockout/issues/466

https://github.com/SteveSanderson/knockout/issues/485

Thanks,

Michael