Forum PHP.pl > [javascript] formularze

Pomoc - Szukaj - Użytkownicy - Kalendarz

Mayger

16.12.2006, 15:36:34

Mam takie pytanie. Jak zrobić w javie że np. mam <select.. i jeżeli jest value = 1 to wyświetlają się inne inputy a jak value = 2 to inne. Chce żeby do się robiło dynamicznie tylko nie wiem dokładnie jak to w javie zrobić. Jak ktoś by mógł pomóc to prosze jeszcze o jakiś przykładzik

JaRoPHP

16.12.2006, 23:17:10

Cytat

Chce żeby do się robiło dynamicznie tylko nie wiem dokładnie jak to w javie zrobić

JAVA to nie jest JavaScript!.

Aby to zrobić, w polu typu select wywołujesz zdarzenie onchange="fun()", i definiujesz funkcję języka JavaScript. Coś w tym stylu (wyświetlają się różne elementy <div />):

[HTML] pobierz, plaintext 
<html>
<head>
<style type="text/css">	
   div { width: 100px; height: 100px; margin: 0 0 2em 0; }
   #k1 {border: 1px solid #000; display: block; background: #000; color: #FFF;}
   #k2 {border: 1px solid #000; display: none; background: #FFF; color: #000;}
</style>
<script type="text/javascript">
function wybierz() {
   oSelect = document.getElementById("wybor");
   if(oSelect.value == "pole1") {
      document.getElementById("k1").style.display = "block";
      document.getElementById("k2").style.display = "none";
   } else {
      document.getElementById("k1").style.display = "none";
      document.getElementById("k2").style.display = "block";
   }
}
</script>
</head>
<body>
<div id="k1">RAZ</div>
<div id="k2">DWA</div>
<select id="wybor" onchange="wybierz()">
<option value="pole1">Pole 1</option>
<option value="pole2">Pole 2</option>
</select>
</body>
</html>
[HTML] pobierz, plaintext

EDIT:
Poprzednio była zdefiniowana funkcja JS o nazwie doIt(), natomiast zdarzenie onchange odwoływało sie do funkcji wybierz() - co powodowało, że przykład nie działał.

Mayger

17.12.2006, 15:40:56

Cytat(JaRoPHP @ 16.12.2006, 23:17:10 )

[HTML] pobierz, plaintext 
function doIt() {
   oSelect = document.getElementById("wybor");
   if(oSelect.value == "pole1") {
      document.getElementById("k1").style.display = "block";
      document.getElementById("k2").style.display = "none";
   } else {
      document.getElementById("k1").style.display = "none";
      document.getElementById("k2").style.display = "block";
   }
}
[HTML] pobierz, plaintext

A nie można po prostu w miejsce tego:

[HTML] pobierz, plaintext 
document.getElementById("k1").style.display = "block";
      document.getElementById("k2").style.display = "none";
[HTML] pobierz, plaintext

Wstawić tej treści i wywołać jakoś tą funkcje, bez bawienia się w divy?

JaRoPHP

17.12.2006, 23:44:49

Cytat(Mayger @ 17.12.2006, 15:40:56 )

A nie można po prostu w miejsce tego...
Wstawić tej treści i ...

Jakiej treści?

Zaprezentowałem przykład, ukazujący, że jest możliwość wyświetlania różnych elementów, w zależności od aktualnej wartości pola <select />. Tak zrozumiałem twój problem... Wydaje mi się, że najprostszym rozwiązaniem (ale oczywiście nie jedynym) jest umieszczenie odpowiednich pól <input /> w elementach <div /> (a potem odpowiednio je wyświetlać).
Jedną z alternatyw jest wykorzystanie metod createElement(), createTextNode(), appendChild() i removeChild() (lub odpowiednio zastosowane replaceChild())...

Mayger

20.12.2006, 15:34:50

ten twój sposób nie za bardzo działa :] http://www.lool.pl/test(2).php
---edit---
na moje oko bład jest w zmienianiu display :]

JaRoPHP

20.12.2006, 15:56:28

Sposób działa, ale wkradł sie mały błąd (już jest poprawiony).
Nazwa funkcji JavaScript ma być wybierz(), a nie doIt().

Mayger

20.12.2006, 16:01:40

No już działa, zastanawialo mnie co ma znaczysz to doit() ale orłem w javascript nie jestem

JaRoPHP

21.12.2006, 18:56:31

Cytat

... w javacripcie to w ogóle nie działa ... a myślę że w Ajaxie dało by się to jakoś łatwo rozwiązać

Skąd taki wniosek? Czym jest AJAX (Asynchronous JavaScript and XML), jak nie wykorzystaniem m.in. języka JavaScript?

Jaką treść chcesz zmienić? Podaj jakiś przykładowy kod HTML/XHTML, i napisz co się ma zmieniać (i kiedy ta zmiana ma zajść).

Mayger

21.12.2006, 19:18:43

widocznie to twoje rozwiązanie z javascriptem nie jest do końca poprawne i stąd ten mój wniosek

JaRoPHP

21.12.2006, 22:48:56

Rozwiązanie jakie przedstawiłem jest poprawne... Ale oczywiście dla mojego zrozumienia problemu.

Jak chcesz uzyskać rozwiązanie "poprawne" to napisz choć kawałek kodu, i wytłumacz jak ma on działać. Wtedy na pewno uzyskasz rezultat, który będzie bardziej pasował do Twojego problemu.
Jak ograniczasz się tylko to definicji problemu, to zazwyczaj uzyskujesz przykładowe rozwiązanie (lepsze lub gorsze).

[EDIT]
Widzę, że link który zamieściłeś: http://www.lool.pl/test(2).php, uległ zmianie. Po zaglądnięciu do źródła, zrozumiałem, gdzie popełniasz błąd @Mayger: atrybut id to identyfikator elementu, co oznacza, że tylko jeden element na stronie, może mieć id o tej samej nazwie.

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.