Come associare pulsanti dialogo jQuery per un ko ViewModel

Question

Quello che mi piacerebbe fare è fare una finestra di dialogo dove i pulsanti sono databound al ko ViewModel in modo da poter attivare o disattivare questi pulsanti a seconda delle varie condizioni sul modulo

Ma il modo in cui si fanno i pulsanti nelle finestre di dialogo jQuery è un po 'diverso rispetto al normale.

Qualcuno ha una soluzione per questo?

Answer 1

1. Assicurarsi di applicare il proprio class ai pulsanti della finestra di dialogo:

   $("#dialog").dialog({
       buttons: [{
           text: 'Ok',
           class: 'ok-button'
       }]
   });
   

2. Afferra il button.ok-button e applicare un attributo data-bind ad esso (visible qui, solo per dimostrare che funziona). Qui, name è una proprietà osservabile del nostro modello di vista:

   $("button.ok-button").attr("data-bind", "visible: name().length");
   

3. Applica attacchi normalmente:

   var model = { name: ko.observable('') };
   ko.applyBindings(model);
   

Ecco un esempio che nascondere c'è un pulsante "OK" nella finestra di dialogo se name (un'osservabile) ha una lunghezza di > 0: http : //jsfiddle.net/9cRFy/

Answer 2

Per aggiungere alla risposta di Andrea, dal momento che l'attributo data-bind è solo un altro attributo è possibile aggiungere ai pulsanti, questo lavoro sarebbe anche:

$("#dialog").dialog({
    buttons: [{
        text: 'Ok',
        'data-bind': 'visible: name().length'
    }]
});