Strona główna kursu

JavaScript - DHTML, standard w3c DOM, dodawanie elementów, tworzenie elementów, usuwanie elementów, formularze

DZIAŁANIE:
Imie
Czy podasz 2 imie ?
Tak, podam
Nie podam!
Telefon
 

Kod:

Kurs JavaScript, Kurs Ajax, Kurs PHP

Ewentualne Objaśnienia:

W poprzednim przykładzie pokazałem jak wstawić nowy element do strony, wstawiany element pojawiał się na końcu strony (jako ostatni nowy element potomny body). Tutaj pokazuje jak wstawić go sobie nowy element w dowolne miejsce na stronie. Potrzebna nam jest do tego metoda insertBefore gdzie jako parametry podajemy nowy element, oraz ten przed którym ma on zostać wstawiony.

Mamy tutaj prosty formularz i zależnie od tego co użytkownik wybierze w przycisku radio (tzn. który) to pojawia się nowe pole formularza, albo znika. Jest to bardzo prosto zrobione zobaczmy mniej więcej :
- jak wiadomo w momencie kliknięcia danego przycisku radio wywoływana jest odpowiednia funkcja JS
- funkcja do dodawania nowego pola:
    - tworzymy dwa nowe elementy div oraz input, ustawiamy dla nich odpowiednie atrybuty
    - dla naszego nowego diva tworzymy elementy potomne czyli pole tekstowe, węzeł tekstowy, znacznik br
    - odczytujemy sobie nasz formularz oraz pole tekstowe o id "telefon"
    - wstawiamy przez insertBefore do formularza naszego diva, zaraz przed pole tekstowe 'z telefonem'
- usuwanie pola (a raczej diva) :
    - pobieramy sobie naszego diva, pobieramy formularz i poprzez metodę usuwającą element potomny czyli removeChild usuwamy naszego diva