dynamiczne OPTION, dodawanie i usuwanie Opcje

[php programmer]

Hej.

Chciałbym dynamicznie (ale już na poziomie JS)
dodawać i usuwać elementy <OPTION>,

dokładniej chodzi o to, że są dwa okienka (tzn elementy <SELECT>),
w jednym jest pełna lista (stała), a druga lista
ma zawierać jedynie te elementy które kazemy do niej dopisać
(a które pochodzą z pierwszej listy, guzik dodaj)
oczywiscie chciałbym mieć też możliwośc usuwania <OPTION> (guzik usun)

ponizej kod, ktory wyświetla zaznaczony element ze stałej listy (moze sie przyda)

wybrany = document.film_form.filmy.selectedIndex;
alert(document.film_form.filmy.options[wybrany].value);

Ten post edytował php programmer 29.08.2005, 11:48:21

[revyag]

Kod

<script type="text/javascript">
function add() {
    var x=document.getElementById("s1");
    var y=document.getElementById("s2");
    y.options[y.length] = new Option(x.options[x.selectedIndex].text,x.selectedIndex.value);
  
}
function remv() {
    document.getElementById("s2").remove(document.getElementById("s2").selectedIndex);
}
</script>

[HTML] pobierz, plaintext 
<select id="s1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select><br /><br/>
<select id="s2">
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
</select><br /></br />
<input type="button" onclick="add()" value="dodaj" />
<input type="button" onclick="remv()" value="usun" />
[HTML] pobierz, plaintext 

[php programmer]

DZIEKI (IMG:http://forum.php.pl/style_emoticons/default/exclamation.gif) !

rozumiem, że

x.selectedIndex
oraz
x.options[x.selectedIndex]

to to samo

Ten post edytował php programmer 29.08.2005, 12:18:00

[revyag]

Nie.
x.selectedIndex - to bieżący option w selekcie
x.options[x.selectedIndex] - to jest odwołanie sie do elementu w tablicy ze wszystkimi optionami. Tutaj jest odwołanie do indeksu którym jest bieżący option. Jest to zrobione po to żeby dostać się do własności text danego optiona.

[php programmer]

A jak zmodyfikować tą funkcję usuwająca, aby zamiast usuwac z listy
otwierała to jako link

function remv() {
document.getElementById("s2").remove(document.getElementById("s2").selectedIndex);
}

function Link() {
document.getElementById("s2").-------(document.getElementById("s2").selectedIndex);
}

[revyag]

Kod

function Link() {
    location.href=document.getElementById("s2").selectedIndex.value;
}

Zakładając że value pola option ma postać: http://www.adres.pl

[php programmer]

no tak przeciez location,

mam jeszcze jeden problem, ponizsza funkcja listuje wartosć text

function Listuj(){
var lista = document.getElementById("lista");
for (i=0;i<lista.length;i++){
alert(lista.options[i].text);
}

ale nie wiem jak zrobic, by listowało wartości.
(próbowałem róznych kombinacji ale nie idzie)

[nospor]

@php programmer jesteś na mojej czarnej liście osób, które wogóle nie zaglądają do manuala, specyfikacji, czy wogóle nie próbują poszukac prostych rzeczy tylko lecą na forum z pytaniam. Od jakiegoś czasu trzymasz twardą taką postawę. Niedlugo zaczną się sypać ostrzeżenia.

próbowałem róznych kombinacji ale nie idzie

Ty nie kombinuj a zajrzyj do specyfikacji

.value

[php programmer]

to moze dałbyś mi łaskawie jakiś link do tej specyfikacji,
poza tym korzystam z róznych manuali i tutoriali, a jak nie znajduje tam
odpowiedzi to zadaję pytanie na forum dopiero
(np jesli chodzi o js to korzystam z kursu Michała Gwoździa)

do nospor:
tylko że teraz chodzi o js a nie mysql
http://www.ipts.w.pl
ale nie wiem czy tam coś jeszcze jest (ja mam kurs offline)
i na temat select i options jest to co poniżej:


SELECT
length - liczba opcji listy blur - usuwa fokus z opcji
name - parametr NAME listy focus - ustawia fokus na opcji
type - parametr TYPE listy
options - odnośnik do konkretnych opcji
selectedIndex - tablica indeksów wybranych elementów

OPTION
defaultSelected - określenie początkowego stanu elementu
selected - określenie aktualnego stanu elementu
text - tekst elementu
value - parametr VALUE

Ten post edytował php programmer 30.08.2005, 08:43:37

[nospor]

O, i masz jak wół podane value. WIec czemu ci nie dziala?

Co do linków to staram się podawać. Ostatnio ci podale, gdy zamknalem temat w mysql

[php programmer]

no wiem że mam podane, ale jest możliwosc
jedynie podania value zaznaczonego elementu, a nie całej listy.


lista.options[i].text - to działa
lista.options[i].value - to juz nie dział działa

Ten post edytował php programmer 30.08.2005, 08:47:31

[nospor]

A sprobowales chociaż? Robisz tak samo jak z text:

[HTML] pobierz, plaintext 
function Listuj(){
var lista = document.getElementById("lista");
for (i=0;i<lista.length;i++){
alert(lista.options[i].value);
}
[HTML] pobierz, plaintext 

przecież jak wól masz napisane że value jest dla option a nie select. Kazde option ma value tak jak i tekst

[php programmer]

tak juz spróbowałem na początku jak mówisz,
pewnie teraz powiesz, że parametr value jest pusty, ale nie jest
(sprawdzałem pokaz zrodło strony i jest także value)

Ten post edytował php programmer 30.08.2005, 08:53:23

[nospor]

Pokaz caly kod bo az misie wierzcy nie chce. POkaz tego selecta jak budujesz.
Zrobilem maly test. alert dla value nic nie wyswietla gdy option nie ma value, w przeciwnym wypadku wyswietla value

[php programmer]

Dobra już sam doszedłem w czym tkwi problem.
Sprawa była bardzo subtelna, ponieważ jej źródło problemu tkwiło troche wcześniej. Kolega, który mi na początku napisał funkcję kopiującą z jednej listy na drugą zrobił chyba błąd. (pierwsza lista miała value i text co było widać już w źródle ale druga lista - ta dynamiczna otrzymywała jedynie text)

Napisał:
function Dodaj(){
var source = document.getElementById("filmy");
var dest = document.getElementById("lista");
dest.options[dest.length] = new Option(source.options[source.selectedIndex].text,source.selectedIndex.value);
}


Poprawiłęm na (poprawka w ostatniej linjce tej funkcji):

function Dodaj(){
var source = document.getElementById("filmy");
var dest = document.getElementById("lista");
dest.options[dest.length] = new Option(source.options[source.selectedIndex].text,source.options[source.selectedI
ndex].value);
}


I TERAZ MI DZIAŁA

Ten post edytował php programmer 30.08.2005, 09:02:23

[nospor]

Oki, a na przyszlość bardziej dokladniej formułuj zapytania. Twoje pytanie powinno wygladac mniej wiecej tak:

Witajcie kochani forumowicze, uwielbiam was (to taki żart (IMG:http://forum.php.pl/style_emoticons/default/laugh.gif) ).
A poważnie:
Mam problem z wyswietleniem value dla wszystkich opcji selecta. Używałem różnych kombinacji min. value, które powinno działać a nie działa. Oto kod.w czym problem?

Ty nie wspomaniałes o tym value, więc pomyslalem ze go jednak nie uzyles, gdyz to wlasnie value odpowiada za wartosc option. Sorki wiec ze siępospieszylem teraz z oskarzeniami, ale wynikało to tylko i wylacznie z dosc skrótowych informacji, które podałes. Naprawdę warto jest dopisac jedno zdanie wiecej (czy nawet dwa), żeby wszystko bylo jasne i nie trzeba bylo ciągnąc ludzi za jezyk.

pozdro

[revyag]

@php programmer - kolega nie zrobił błędu.

Kod

new Option(x.options[x.selectedIndex].text,x.selectedIndex.value)

Ta linia tworzy nową opcję w selekcie:
- x.options[x.selectedIndex].text - tekst z optiona, który jest ustawiony jako bieżący w pierwszym selekcie
- x.selectedIndex.value - wartość optiona, który jest ustawiony jako bieżący w pierwszym selekcie.

@nospor - mały błędzik zrobiłeś (IMG:http://forum.php.pl/style_emoticons/default/snitch.gif)
powinno być tak:

Kod

function Listuj(){
    var lista = document.getElementById("lista");
    for (i=0;i<lista.options.length;i++) {
        alert(lista.options[i].value);
    }
}

[nospor]

@revyag Nie koniecznie to był mój błąd. Ja poprostu skopiowałem kod który podał php programmer i zmieniłem w nim text na value. Nie patrzyłem czy reszta jest ok. Skoro mówił że mu siętext wyswietla, znaczy że pętla działała a ja się już w to nie zagłebiałem (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
A i w kodzie któy podałem zjadłem zamykający }. Głodny bylem (IMG:http://forum.php.pl/style_emoticons/default/laugh.gif)

[revyag]

eee, sory (IMG:http://forum.php.pl/style_emoticons/default/snitch.gif)
Nie zauważyłem że było parę postów więcej u góry
Co do tego co napisałem wcześniej to jest oczywiście błąd, sory że zamieszałem.
selectedIndex oczywiście jest indeksem, więc nie może posiadać wartości.
Zły kod wstawiłem i przyjąłem że tak jest dobrze (IMG:http://forum.php.pl/style_emoticons/default/snitch.gif)
Tak jak napisał php programmer jest ok.

[php programmer]

ok mam jeszcze jedno pytanie
(sory ze ciagle pytam, ale rzadko używam połaczenia js i php jednocześnie)

Mam już tą listę wartości z tego dynamicznego okna do którego sie dodaje,
chodzi o to, że jak sie przeładuje formularz to z oczywistych względów
dynamiczne okno jest puste, a chciałbym aby nie traciło swojej poprzedniej zawartości tylko zachowało poprzednią. Jak zrobić, aby w momencie
onSubmit dla formularza, wrzucić do tablicy post wartości z tego dynamicznego selecta?

A moze lepiej zapamiętać w COOKIE?
np coś takiego:
document.write('<? setcookie(...) ?>');

dobra juz wymyśliłem, nie wiem czy zadziała, ale
pomysł jest taki żeby dać ukryte pola <INPUT type="hidden">

Ten post edytował php programmer 30.08.2005, 10:47:30