Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: checkbox i dynamiczny formularz
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
cyngiel
założenia: mam pare checkboxow i do tego obrazek + formularz
oczekiwany efekt:po zaznaczeniu checkboxa obrazek się chowa, pojawia się pole formularzyka

znalazlem nawet i na forum.php.pl
coś działającego z założeń podobnie(zależnie od checkboxa)
ale moja znajomość składni JS jest tak znikoma, że nic mi to nie daje, mógłby mi ktoś podać jakiś link do tutka w tej sprawie, albo jakiś skrypt



oto co znalazłem
http://forum.php.pl/lofiversion/index.php/t45652.html
http://forum.webhelp.pl/viewtopic.php?t=13...&highlight=
tutaj jest praktycznie ten sam problem co mój, z tym, że dla jednego chboxa i tak jakoś dziwnie rozwiązany, mi się wydaje, że najlepiej to na funkcji zrobić


z góry dziękuje za pomoc

pozdrawiam


  1. function ukryj(ch)
  2. {
  3.  
  4. obiekt = document.getElementById(ch);
  5. if (obiekt.style.display == "none")
  6. {
  7. obiekt.style.display = "block";
  8. }
  9.  
  10. else
  11. {
  12. obiekt.style.display = "none";
  13. }
  14. }




coś takiego połowicznie załątwiło sprawe, po klkinięciu pojawia się formularz(display:none), ale obrazek się nie chowa, musiałem usunąć id z obrazka, nie wiem czemu to nie chce ze sobą współpracować, funkcja niby poprawna, ale coś nie gra :/

może jakaś mała wskazóweczka?

nikt mi nie pomoże?

przecież problem nie jest wcale jakiś złożony, a ja nie proszę tylko o jakieś wskazówki :/
Zajec
Jak wywołujesz tę funkcję i co ma jakie id przypisane?
cyngiel
<tr><td><img src="adres"></td>
<td><div id="$i" style="display: none">Załaduj ten plik:<input type="file"></div></td>
<td> <input type="checkbox" name="kasuj" onclick="ukryj($i)"> </td></tr>



tak to działą obecnie, w php oczywiście, pousuwałem to co nieistotne dla problemu- mam nadizeje, że wszystko jasne
jeśli do img przydziele id, to po kliknięciu checkboxa znika obrazek, a nie pojawia się formularz
Zajec
Kod
function ukryj(ch)
{
    if (obiekt = document.getElementById(ch))
    {
        if (obiekt.style.display == "none")
        obiekt.style.display = "block";
        else
        obiekt.style.display = "none";

        obiekt.parentNode.parentNode.getElementsByTagName('img')[0].style.display="none";
    }
}
cyngiel
wielkie dzięki, bardzo mi pomogłeś, fajnei, jeszcze jakbyś objaśnił, co miałęm źle, czemu nie działało, a co w swoim skrypcie dałeś, ale to zawsze troche więcej roboty, więc ciesze się, że jest jak jest, próbowałem to troche zmodyfikowac, gdyż po zaznaczeniu checkboxa obrazek znika i gdy go odznaczamy już się nie pojawia, próbowałem to zmienić na coś takiego:


Kod
function ukryj(ch)
{
    if (obiekt = document.getElementById(ch))
    {
        if (obiekt.style.display == "none")
        obiekt.style.display = "block";
        else
        obiekt.style.display = "none";

    if (obiekt.parentNode.parentNode.getElementsByTagName('img')[0].style.display == "none")
            obiekt.parentNode.parentNode.getElementsByTagName('img')[0].style.display = "block";
        else  
        obiekt.parentNode.parentNode.getElementsByTagName('img')[0].style.display = "none";

    }
}

teraz już działa jak chciałem, pierw źle to składniowo zapisałem, a potem miałem warunki źle- nie wiem czemu, wydawało mi się, że odwrotnie było dobrze, ale tak jakoś działa, czasem są problemy z myśleniem biggrin.gif

w każdym razie dzięki za pomoc smile.gif
Zajec
Nie ma sprawy :-) Wytłumaczenie:


if (obiekt = document.getElementById(ch)) { }
dodałem po to, aby skrypt nie wywoływał błędu w przypadku nie odnalezienia elementu "obiekt".


Z pierwszych warunków usunąłem zbędne klamry, bo gdy instrukcja wystepująca po if'ie składa się tylko z jednej linijki, użycie klamerek nie jest koniecznie.


Co do dodanej konstrukcji:
parentNode - rodzic (czyli element wyżej)
getElementsByTagName('img') - szukanie w elemencie elementu "img"
[0] - użycie pierwszego znalezionego img'a


0 - pierwszy znaleziony img
1 - drugi znaleziony
2 - trzeci znaleziony
itd.
cyngiel
dzieki, masz u mnie piwo winksmiley.jpg
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.