niedziela, 9 stycznia 2011

Checkbox i zdarzenie onClick w jQuery

Ostatnio spotkałem się z trochę dziwnym zachowaniem CheckBoxów. Musiałem napisać funkcję, która ukrywała kilka wierszy w tabeli po odznaczeniu jednego z nich. Obsługa tego w zdarzeniu w onChange odpada na starcie, bo IE wykonuje to tylko gdy CheckBox traci focus. Skorzystałem z onClick. Wszystko było w porządku do czasu, gdy chciałem wywołać to zdarzenie programowo.
Przy standardowym kliknięciu na element najpierw zmienia się właściwość checked, a potem wykonuje się zdarzenie. Gdy wywołamy click programowo wszystko jest odwrotnie, najpierw zdarzenie potem zmiana atrybutu. Pomyślałem, że to znowu wina przeklętego IE, ale okazało się że jednak nie. Pozostałe przeglądarki zachowują się tak samo. Kolejna myśl która przyszła mi do głowy to "Może robię coś nie tak". Zaglądam do dokumentacji jQuery i tam doczytałem się że poza zwyklym click() są jeszcze dwa sposoby na programowe wywołanie zdarzenia.
  1. trigger('click') - Działa tak samo i można używać zamiennie do click() (checked zmienia się po zdarzeniu). Wywołują się zdarzenia rodziców elementu().
  2. triggerHandler('click') - Tu jest trochę inaczej. Wywołuje się tylko event CheckBoxa i nic więcej. Atrybut checked nie zmienia wartości i nie wykonują się zdarzenia elementów nadrzędnych.
Tak właściwie to mamy już rozwiązanie problemu. Najpierw trzeba zmienić checked i potem skorzystać z triggerHandler.

tmp = $('#chb').attr('checked')
$('#chb').attr('checked',!tmp).triggerHandler('click');


W sumie to nie doczytałem się nigdzie i dalej nie wiem dlaczego zmiana CheckBoxa i obsługa zdarzenia wykonują się w innej kolejności. Jeżeli wiecie to zostawcie info w komentarzu :)


    3 komentarze:

    Anonimowy pisze...

    Dzieki za ciekawy blog

    Anonimowy pisze...

    Najlepiej napisac wlasna obsluge formularzy skoro juz korzystasz z jQuery. Wtedy pierwsze, przypisane do danego elementu, zdarzenie zostanie wywolane jako pierwsze.

    Yvus Bellator pisze...

    Chyba nie zrozumiałeś o co chodzi w tym wpisie :) Nie pisałem tutaj o kolejność wywoływania przypisanych zdarzeń. Tylko o tym, że atrybut checked zmienia się przed obsługą zdarzenia gdy klikniemy myszką, a po obsłudze zdarzenia kiedy wywoła się go z poziomu kodu.