Zaznaczanie checkboxa po kliknięciu w wiersz tabeli - problem Opcje

[ggie]

Witajcie,

Od dłuższego czasu męczę się i nie potrafię rozwiązać jednego problemu dot. w/w tematu. Może ktoś z Was podpowie mi metodę.

Otóż, tworzę za pomocą PHP tabelę i umieszczam wiersze z informacjami z bazy danych. W pierwszej kolumnie tabeli umieszczam chceckboxa, którego zaznaczam po kliknięciu na danym wierszu tabeli. W tym celu używam funkcji JS, którą wywołuję (onclick) w tagu <tr>.

Problem polega na tym, że wszystko działa OK dopóki nie kliknę na samego checkboxa - wówczas nie mogę go w ogóle zaznaczyć. Podejrzewam, że chodzi o podwójne wywołanie zdarzenia - jedno zaznacza checkboxa (moja funkcja JS) a drugie odznacza bo już został zaznaczony (działanie samego znacznika) - albo na odwrót.

Może ktoś zna sposób na rozwiązanie tego problemu?

Z góry dzięki za pomoc!

Nie dostałem odpowiedzi ale poradziłem sobie z tematem sam choć metoda jest baaardzo nieelegancka. Zastosowałem dodatkową funkcję w onclick na chceckbox'ie zmieniając jego stan jeszcze raz.

Pozdrawiam forumowiczów!
Temat zamknięty.

[kamil4u]

Lepiej poczytaj o propagacji( stopPropagation ) i bubblingu( cancelBubble ). Kod:

Kod

<table>
<tbody id="test">
<tr><td><input type="checkbox"></td><td>test</td></tr>
<tr><td><input type="checkbox"></td><td>test</td></tr>
<tr><td><input type="checkbox"></td><td>test</td></tr>
<tr><td><input type="checkbox"></td><td>test</td></tr>
</tbody>
</table>

<script>
var trs,tr,el,i;
trs = document.getElementById('test').getElementsByTagName('tr');
for(i=0; tr=trs[i++];){
  
  el = tr.getElementsByTagName('input')[0];
  el.onclick = function(e){
    e=e||event;
    e.cancelBubble = true;
    e.stopPropagation && e.stopPropagation();
  }
  tr.onclick = function(el){
   return function(){ el.checked = !el.checked; }
}(el)
}
</script>