ugrás a tartalomhoz

Multiple Select mező értékei

newyorkerboy · 2010. Május. 28. (P), 19.02
Üdv!
Hogy lehet lekérdezni JavaScript alól egy multiple select mező kijelölt értékeit? A value attribútum csak az utoljára kijelöltet adja vissza!
‹ Fancybox hiba IE-ben Fejlesztési módszertan/eszköz JS-es UI-hoz? ›
 ■
1

option tag(ok) selected tulajdonsága

solkprog · 2010. Május. 28. (P), 19.41
Végigmész az option tagokon és megnézed mindnek a selected tulajdonságát.
2

Multiple select

janoszen · 2010. Május. 28. (P), 22.23
A fenti ötleten túl, ha esetleg meg akarsz szabadulni a multiselecttől, próbálj meg egy ilyen megoldást: http://showcase.janoszen.com/css/scrolling-checkbox/
3

Már majdnem

newyorkerboy · 2010. Május. 29. (Szo), 13.13
Oké, köszi.
Két helyre kell ez a dolog: az egyik egy avatar kiválasztó (ez nem multiple), illetve egy kép kiválasztóhoz, ahova már igen. A gond az, hogy a kiválasztott elemek value értékét be kéne írni egy divbe, de mindegyiket csak egyszer. Kétféleképpen is próbáltam megírni: logikai változóval, és két tömmbel is, ahol az egyikben tároltam az összes kiválasztott elemet, a másikba pedig kiválogattam őket úgy, hogy mindegyik csak egyszer szerepeljen.

Vagyis, csak válogattam volna, mert nem ment. Meg tudnátok mondani, hogyan csináljam?
Tudom hogy ilyen kódrészletek biztosann kellenek bele:

egy féltétel, a program nagy része ezen belül van:
document.getElementById("picture_1").selected==true

illetve valami ilyesmi, egy cikluson belül:
showed[i]=document.getElementById("picture_1").value

ez egy cikluson belül, ahol listázom a kijelölt elemeket egyszer:
document.getElementById("pictures_preview_1").innerHTML+=showed[i]

Valaki össze tudná rakni nekem ezt a függényt? Már annyi féleképpen próbáltam, de elegem lett, és feladtam, kitöröltem azt is, amit összeszenvedtem. Az mindegyik értékét belerakta a showed tömbbe, ha csak az elsőt választottam ki, akkor bele rakta hogy "Value #1", utána pedig az összes elem értéke helyett hogy undefined.
4

Megoldottam, de még mindig rossz

newyorkerboy · 2010. Május. 29. (Szo), 15.28
Megcsináltam, de most valamiért mégsem működik rendesen. Így néz ki külön a html fájl, ahol megírtam a scriptet: (itt még jó)

<script>
function pictures_list(){
var showed=new Array();
var i,count=0;
for(i=0;i<document.getElementById('row_1_pictures').options.length;i++){
if(document.getElementById('row_1_pictures').options[i].selected){
showed[count]=document.getElementById('row_1_pictures').options[i].value;
count++;}}
document.getElementById('pictures_preview_1').innerHTML=showed;}
</script>

<form>
      <select id="row_1_pictures" onchange="javascript:pictures_list();" multiple>
        <option>sea zero
        <option>sea one
        <option>sea two
        <option>sea three
        <option>sea four
      </select>
      <div id="pictures_preview_1"></div>
</form>
És valahogy így nézne ki használatban:


function pictures_list(){
var counter=Number(document.getElementById("counter").value);
var showed=new Array();
var i,count=0;
for(i=0;i<document.getElementById("row_"+counter+"_pictures").options.length;i++){
if(document.getElementById("row_"+counter+"_pictures").options[i].selected){
showed[count]=document.getElementById("row_"+counter+"_pictures").options[i].value;
count++;}}
document.getElementById("pictures_preview_"+counter).innerHTML=showed;}

<select id='row_1_pictures' onchange='javascript:pictures_list();' multiple><option>Kép 1<option>Kép 2<option>Kép 3</select>
A counter értéke jó. Chrome alatt Uncaught TypeError: Cannot read property 'options' of null hibát kapok. Miért nem jó? :(
5

Diszkrét JavaScripttel

Poetro · 2010. Május. 30. (V), 20.12
var select = document.getElementById('row_1_pictures'), // SELECT elem
    selected = []; // Kiválasztottak listája
if (select) {
  // Hozzáadjuk az eseményt a SELECT elemhez.
  select.onchange = function () {
    var options = this.getElementsByTagName('option'), // OPTION elemek
        i = options && options.length, // OPTION elemek száma
        option;                        // Aktuális OPTION elem
        
    if (i) {                           // Ha vannak OPTION elemek...
      for (; i > 0; i -= 1) {          // végigmegyünk rajtuk..
        option = options[i - 1];       // kivesszük az aktuálisat...
        if (option.selected) {         // ha az ki van választva...
          selected.push(option.value); // akkor mehet a listába.
        }
      }
    }
  }
}
6

Jee

newyorkerboy · 2010. Május. 31. (H), 19.48
Ezaz, köszönöm! Örök hála!