cheque nocaut/desmarcar todos cuadro combinado

Question

I utilizando knockout para el mapeo JSON obejct de control de usuario, tengo una lista de casillas de verificación individuales, Parecen

<input type="checkbox" data-bind="checked: IsEnabled1" /> 

tengo JSONObject

var viewModel = { 
      IsEnabled1 :ko.observable(true),    
      IsEnabled2 :ko.observable(true), 
      IsEnabled3 :ko.observable(false) 
     }; 
    ... 
    ko.applyBindings(viewModel); 

Y quiero agregar una casilla de verificación global que marcará/desmarcará todas las demás, realicé estos cambios en el lado de JavaScript pero la parte de la IU de actualización del cuadro de verificación global pero los datos de las casillas de verificación separadas no se asignan al objeto JSON.

casilla de verificación Global

$("#GeneralTable thead tr th:first input:checkbox").click(function() { 
      var checkedStatus = this.checked; 
      $("#GeneralTable tbody tr td:first-child input:checkbox").each(function() { 
       this.checked = checkedStatus;      
      }); 

     }); 

después de este código objeto JSON mi contienen datos que no están relacionadas con la interfaz de usuario.

¿Cómo actualizar todas las casillas de verificación JSON después del cambio del lado de JS?

Answer 1

Por favor, compruebe el ejemplo: http://jsfiddle.net/MenukaIshan/5gaLjh2c/

Creo que es exactamente lo que necesita. Todos los artículos tienen IsChecked propiedad observable. ViewModel contiene observable calculado (legible y escribible) para marcar o desmarcar todos los elementos.

Answer 2

Hay una solución alternativa aquí http://jsfiddle.net/rniemeyer/kXYuU/

La solución anterior se puede mejorar de dos maneras

-Para hacer AllChecked falsa para las listas vacías, necesitamos comprobar la longitud

-Para reducir el número de recálculos al seleccionar todo para una lista larga, tenemos que agregar acelerador

self.AllChecked = ko.computed({ 
    read: function() { 
     var firstUnchecked = ko.utils.arrayFirst(self.Items, function(item) { 
      return item.IsChecked() == false; 
     }); 
     return self.Items.length && !firstUnchecked; 
    }, 
    write: function(value) { 
     ko.utils.arrayForEach(self.Items, function(item) { 
      item.IsChecked(value); 
     }); 
    } 
}).extend({ throttle: 1 });