No puedo obtener el permitir a la unión a trabajar en Knockout JS. Con la propiedad enabled se establece en false, el botón no está deshabilitado y yo todavía puede hacer clic en él.

ver el violín

<a  class="btn btn-xl btn-primary" 
    href="#" 
    role="button" 
    data-bind="enable: enabled, click: clicked, visible: isVisible">
        <i class="icon-only icon-ok bigger-130"></i>
</a>      

var ViewModel = function(){
    var self = this;

    self.enabled = ko.observable(false);
    self.isVisible = ko.observable(true);
    self.clicked = function(){
        alert('You clicked the button');
    };
};

$(function(){
    var model = new ViewModel();
    ko.applyBindings(model);
})          

OriginalEl autor Th4t Guy | 2014-03-27

5 Comentarios

  1. 22

    Habilitar enlace no funciona con cualquier cosa que usted desea.

    Esto es útil con los elementos de formulario como input, select, y textarea
    También funciona con los botones. Como en mi ejemplo http://jsfiddle.net/5CbnH/1/

    Pero no funciona con tu enlace. Se están usando twitter bootstrap y activar/desactivar sus «botones» con clases css. Así que hay que utilizar css unión como este:

    data-bind="css: { yourClass: enabled }"

    Comprobar qué clase es responsable de inicio para mostrar su «botón» y modificar el código de acuerdo con css unión.

    Gracias. Llegamos a la misma conclusión, pero tienes más rápidamente.
    Esto es viejo, pero el violín necesidades de cierre de la cotización en el botón de enlace de datos

    OriginalEl autor Salvador Dali

  2. 19

    Derecho:

    habilitar /deshabilitar

    Mal:

    activado /desactivado


    Asegúrese de poner el disable en lugar de disabled y enable en lugar de enabled.

    <input type="text" data-bind="value: foo, enable: isEditing"/>   YES!!
    <input type="text" data-bind="value: foo, enabled: isEditing"/>   NO!

    Este ejemplo de un cuadro de texto. Error fácil de hacer 🙂

    Oh querido dios el horror de los errores tipográficos… Gracias…
    Santa f*cking mierda hombre! Gracias… Bueno… que tomó casi una hora…. Jesús!

    OriginalEl autor Simon_Weaver

  3. 6

    Para las personas que encontramos en búsqueda de:

    Tuve un problema para conseguir el permitir a la unión a trabajar así. Mi problema estaba tratando de usar una expresión compleja sin hacer referencia a las características observables como funciones:

    <input type="button" data-bind="enable:AreAllStepsVerified && IsFormEnabled, click:SubmitViewModel"/>

    Debería haber sido:

    <input type="button" data-bind="enable:AreAllStepsVerified() && IsFormEnabled(), click:SubmitViewModel"/>

    Ver: https://stackoverflow.com/a/15307588/4230970

    OriginalEl autor R. Salisbury

  4. 5

    Lo que el Salvador dijo en su respuesta.

    Usted debe entender que el enabled y disabled de unión en octavos de final del trabajo por poner un disabled atributo en el elemento de DOM de destino. Ahora, si nos fijamos en el código HTML de la documentación que se nota que no todos los elementos HTML de apoyo a este atributo.

    Realidad sólo los elementos de formulario (por ejemplo,<button>). <a> no.

    OriginalEl autor jods

  5. 0

    Yo tengo que trabajar por el cambio de la etiqueta de anclaje a un botón, no muy segura de por qué esto facilita el trabajo, pero funciona de todos modos.

    Actualizado el violín.

    <button  class="btn btn-xl btn-primary" 
        role="button" 
        data-bind="enable: enabled, click: clicked, visible: isVisible">
            <i class="icon-only icon-ok bigger-130"></i>
    </button>
    Esto funciona porque a no tiene deshabilitar habilitar las opciones. Necesitas usar bootstrap css (como ya he sugerido) o para hacer que un botón real (como has cambiado aquí).

    OriginalEl autor Th4t Guy

Dejar respuesta

Please enter your comment!
Please enter your name here