Cześć,
napotkałem dziwny problem którego nie umiem wyjaśnić.
Tworzę formularz z checkboxami. Postanowiłem opracować mechanizm, że po zaznaczeniu danego checkboxa będą się pod nim wyświetlać inputy z dodatkowymi danymi do wprowadzenia. Analogicznie po odznaczeniu checkboxa te inputy mają zniknąć. Udało mi się to zrobić bezproblemowo przy jednym inpucie:
<input type="checkbox" name="s_podstawowe" value="Szkolenie podstawowe" class="form-check-input" onclick="document.getElementById('s_podstawowe1').style.display = 'block'; if(this.checked==false){document.getElementById('s_podstawowe1').style.display = 'none';}" value="yes" />
<label for="s_podstawowe">Szkolenie podstawowe</label>
<input type="text" id="s_podstawowe1" placeholder="Data uzyskania" class="form-control" style="display:none;" name="s_podstawowe_od">
Problem pojawił się kiedy postanowiłem dodać większą ilość tych 'ukrytych' inputów. Jak wiadomo, getElementById działa tylko dla jednego ID, w związku z tym postanowiłem użyć getElementsByClassName. Niestety, w tym przypadku po zaznaczeniu checkboxa nic pod spodem nie chce się pojawić. Kod wygląda następująco:
<input type="checkbox" name="s_podstawowe" value="Szkolenie podstawowe" class="form-check-input" onclick="document.getElementsByClassName('s_podstawowe_h').style.display = 'block'; if(this.checked==false){document.getElementsByClassName('s_podstawowe_h').style.display = 'none';}" value="yes" />
<label for="s_podstawowe">Szkolenie podstawowe</label>
<input type="text" placeholder="Data uzyskania" class="form-control s_podstawowe_h" style="display:none;" name="s_podstawowe_od">
<input type="text" placeholder="Numer zaświadczenia" class="form-control s_podstawowe_h" style="display:none;" name="s_podstawowe_nr">
Gdzie popełniam błąd?
Dzięki wielkie z góry.
Michał