Tristavovy checkbox z Google Closure library jako prepinac

Zajimalo by mne zda lze nejak jednoduse upravit chovani checkboxu z Closure library aby sam neaktualizovat checked/unchecked stav. Rad bych jej pouzil jako prepinac pro zmenu aktualniho vyberu - inverzi a nikoliv natvrdo o(d)znacit vse.

Me predstavy jsou nasledujici. Mam seznam polozek a u kazde jeden checkbox. Pak bych ale chtel pridat jeste jeden extra checkbox jenz pote co na nej uzivatel klepne, zmeni stav vybrano/nevybrano u vsech polozek a sam se nastavi tak aby odrazel stav vsech polozek. Pokud jsou vsechny vybrany, bude take vybran. Pokud neni vybrano nic, nebude tex oznacen a v pripade ze je vybrana jen cast polozek, mel by se nastavit do 'nedefinovaneho' stavu.

Jak na to? Nastaveni 'nedefinovaneho' stavu uvnitr obsluhy kliknuti je okamzite prepsano stavajici obsluhou udalosti a nepodarilo se mi najit rozumne vysvetleni jak vlastne udalosti uvnit teto knihovny funguji a jsou zpracovavany...

Zišla by sa ukážka kódu, ako to riešiš, tú knižnicu asi pozná málo kto. Klasicky by som to riešil cez udalosť onclick a vždy skontroloval v akom stave sú všetky checkboxi.

KERNEL ULTRAS video channel >>>

7.2.2012 18:23 phoenix
Rozbalit Rozbalit vše Re: Tristavovy checkbox z Google Closure library jako prepinac

Ono jde spise o to pochopit udalostni model teto knihovny a jejich komponent. Myslim, ze zde ukazka kodu moc nepomuze protoze se vlasten jedna jen o nastaveni stavu te jedne komponenty a jeho zachovani...

Pri vytvareni stranky si udelam komponentu checkbox jenz prijde do elementu s id="toggle", a nastavim obsluhu udalosti na kod moji metody onToggle

phx.ExtendedList.prototype.render = function(container) {
  ...
  // vytvorim checkbox, umistim do stranky a nastavim obsluhu udalosti
  var cbToggle = new goog.ui.Checkbox();
  var context = this;
  cbToggle.render(goog.dom.getElement('toggle'));
  goog.events.listen(cbToggle,
    goog.ui.Component.EventType.ACTION,
    function(evt) {
      context.onToggle(evt);
    });
  ...
};

No a v obsluze udalosti se snazim nastavit stav tohoto checkboxu k obrazu svemu

phx.ExtendedList.prototype.onToggle = function(evt) {
  ...
  // nastaveni stavu podle poctu oznacenych polozek
  var newState = goog.ui.Checkbox.State.UNDETERMINED;
  switch (checkedCount) {
    case rowsCount:
      newState = goog.ui.Checkbox.State.CHECKED;
      break;
    case 0:
      newState = goog.ui.Checkbox.State.UNCHECKED;
      break;
  }
  evt.target.setChecked(newState);
  ...
};

Kdyz to krokuji, tak se stav opravdu zmeni na nedefinovany, ale pak jeste prijde ke slovu nejaka dalsi udalost, jenz jeho stav prepne znovu. No a ja jsem nahrany :-(

Dotaz: Tristavovy checkbox z Google Closure library jako prepinac

Odpovědi