Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS] wartość pola SELECT do pola TEXT i inne
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
lonek
Witam,

Problem zapewne banalny, ale nie znam się kompletnie na JS, stąd mój post.

Pytanie pierwsze: jak przekazać dynamicznie wartość pola SELECT do pola INPUT TYPE=TEXT? Tak, żeby po prostu zawartość INPUT'a uaktualniała się po każdej zmianie opcji w SELECT..

Pytanie drugie: Często spotykam się z formularzami, w których wybranie danej opcji z listy SELECT powoduje zmianę dalszej zawartości dokumentu, np. taka sytuacja:

Pole SELECT zawiera wartości "kobieta" i "mężczyzna". Po wybraniu opcji "kobieta" pojawiają się dwa następne pola SELECT, np. "wybierz kolor oczu" i "wybierz kolor włosów". Po wybraniu opcji "mężczyzna" pojawiają się pola "wybierz markę samochodu" i "wybierz markę perfum".

Jak osiągnąć taki efekt? smile.gif

Z góry dzięki za pomoc.

--
Lonek
.radex
daj sobie id="xxxx" i za pomocą AJAX'a zrob to.

Dam ci tu ajaxa:

Kod
/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
var loadedobjects=""
var rootdomain="http://"+window.location.hostname

function ajaxpage(url, containerid){
var page_request = false
if (window.XMLHttpRequest) // if Mozilla, Safari etc
page_request = new XMLHttpRequest()
else if (window.ActiveXObject){ // if IE
try {
page_request = new ActiveXObject("Msxml2.XMLHTTP")
}
catch (e){
try{
page_request = new ActiveXObject("Microsoft.XMLHTTP")
}
catch (e){}
}
}
else
return false
page_request.onreadystatechange=function(){
loadpage(page_request, containerid)
}
if (bustcachevar) //if bust caching of external page
var bustcacheparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()
page_request.open('GET', url+bustcacheparameter, true)
page_request.send(null)
}

function loadpage(page_request, containerid){
if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1))
document.getElementById(containerid).innerHTML=page_request.responseText
}

function loadobjs(){
if (!document.getElementById)
return
for (i=0; i<arguments.length; i++){
var file=arguments[i]
var fileref=""
if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
if (file.indexOf(".js")!=-1){ //If object is a js file
fileref=document.createElement('script')
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", file);
}
else if (file.indexOf(".css")!=-1){ //If object is a css file
fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet");
fileref.setAttribute("type", "text/css");
fileref.setAttribute("href", file);
}
}
if (fileref!=""){
document.getElementsByTagName("head").item(0).appendChild(fileref)
loadedobjects+=file+" " //Remember this object as being already added to page
}
}
}


użycie proste: java script:ajaxpage('test.php', 'contentarea');

możesz przerobić żeby tekst. Działa przy divach, nie wiem jak z innymi
lonek
Cheers mate, postaram się przez to jakoś przejść. smile.gif
Cienki1980
Co do pierwszego problemu to tutaj jest bardzo fajnie to zrobione w JS. Akurat w tym przypadku jest przenoszenie między dwoma multiselectami, ale bardzo łatwo przerobić to na dopisywanie do pola <textarea> po każdej zmianie w SELECT.

Co do drugiego pytania można zrobić to też w JS ukrywając i pokazując odpowiednie selecty w zależności od wyboru płci w selecie pierwszym, ale AJAX chyba załatwi to szybciej i czyściej ... takie moje wrażenie.
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.