Usando o KnockoutJS com nós desconectados
O que eu quero fazer é separar alguns nós usando o método detach do jQuery, atualizar meu ViewModel, anexar meus nós e ter os valores atualizados.
Isso é possível?
Aqui está umviolino completo do que estou fotografando. Basicamente, eu gostaria de poder ir da esquerda para a direita, clicar em desanexar, atualizar e anexar e ter novos valores nas caixas de texto.
ATUALIZAR
Com base na resposta do RP, a melhor aposta, supondo que isso se encaixa no seu caso de uso, é anexá-los ao dom.escondido, atualize seu viewmodel e mostre seus nós. Algo assim funciona para mim:
$("#updateAndAttach").click(function () {
var junk = $("<div />").css("display", "none");
junk.append(nodes);
$("#home").append(junk);
vm.a("AAA");
vm.b("BBB");
$(nodes).unwrap();
});
ATUALIZAÇÃO FINAL
Aqui está o código completo:
JavaScript
$(function () {
function ViewModel() {
this.a = ko.observable("a");
this.b = ko.observable("b");
}
var vm = new ViewModel();
ko.applyBindings(vm, document.getElementById("home"));
var nodes = null;
$("#detach").click(function () {
nodes = $("#home").children().detach();
});
$("#attach").click(function () {
$("#home").append(nodes);
});
$("#update").click(function () {
vm.a("AAA");
vm.b("BBB");
});
})();
HTML:
<div id="home">
<input type="text" data-bind="value: a" />
<input type="text" data-bind="value: b" />
</div>
<button id="detach">Detach</button>
<button id="update">Update</button>
<button id="attach">Attach</button>