[html/javascript] Item toevoegen aan listbox

[Verwijderd]

Ik heb op mijn pagina 2 van die select-boxen staan. De linker wordt gevuld vanuit een db. De rechter is in het begin leeg. Nu wil ik dus een item uit de linker box kunnen selecteren en met een knop kunnen verplaatsen naar de rechter box. Nu is mijn vraag echter; welke methode heb ik daarvoor nodig ? Of waar vind ik bijv. een lijst met methodes die hiervoor relevant zijn ?

[sjroorda]

Dat kan met document.formulier.veld.options.add en -remove.

Dit werkt echter niet onder Netscape, alleen IE.

[ Voor 38% gewijzigd door sjroorda op 15-04-2003 12:51 ]

[Verwijderd]

kun je dan .add("item") gebruiken ?

[sjroorda]

Sorry, ik ben iets te snel. De twee functies die ik in lang vervlogen tijden heb gebruikt zijn:

code:

function addExt()
{
    var waarde = document.ext_form.ext_add_field.value;
    var _t = document.createElement("OPTION");
    
    _t.text  = waarde;
    _t.value = waarde;
    document.ext_form.ext_select.options.add(_t, document.ext_form.ext_select.length);
    
    document.ext_form.ext_add_field.value = "";
}

function removeExt()
{
    if (document.ext_form.ext_select.selectedIndex > -1)
        document.ext_form.ext_select.options.remove(document.ext_form.ext_select.selectedIndex);
}

Je moet dus eerst een option aanmaken, en dan kan je die toevoegen.

Ik ben me ervan bewust dat het ongetwijfeld veel beter kan, maar zoals ik al zei: dit is oude code, en daarna nooit meer gebruikt, dus nooit geoptimaliseerd geweest .

[sjroorda]

Maar ik ben weer veel te aardig eigenlijk: zoek zelf eens op bijvoorbeeld www.jsexamples.com, daar vind je ook van alles wat.

[Verwijderd]

thanks iig

[Verwijderd]

Als .add en .remove niet werken in NS of Mozilla heb ik hier nog wel een optie die werkt in zowel IE als Netscape

Voor het toevoegen van een optie:

code:

var ListControl = eval('document.DeFormNaam.DeListboxnaam');
var myNewOption = new Option(option_text, option_value);
ListControl.options[ListControl.options.length] = myNewOption;

En het verwijderen:

code:

var ListControl = eval('document.DeFormNaam.DeListboxnaam');    
for(var i=(ListControl.options.length-1); i>0; i--) {
  if ((ListControl.options[i]!=null) && (ListControl.options[i].selected==true))
     ListControl.options[i] = null;
}

[r0bert]

Zonder eval dus..
ipv

code:

var ListControl = eval('document.DeFormNaam.DeListboxnaam');

code:

var ListControl = document.DeFormNaam.DeListboxnaam;

[Verwijderd]

Het voorgaande werkt zoals ik het wil

Nu wil ik echter de inhoud van die rechter listbox opvragen wanneer ik het formulier submit mbv ASP. Tot mijn verbazing wordt die informatie uit die listbox helemaal niet gesubmit Heeft iemand hier een oplossing voor ? Moet je dan bijv. eerst alles mbv javascript uitlezen ?

[McVirusS]

Ik zie hier een hoop vieze code voorbij komen, een "listbox" aanspreken doe je op volgende manier: document.forms['formnaam'].elements['naamvanlistbox'] (en ja Cheatah kan nog netter met namedItem enzo maar dat laten we even buiten beschouwing).

Ik denk dat ik weet wat jouw probleem is, alleen geselecteerde items worden meeverzonden met een submit. Oplossing is om voor het submitten automatisch met JS alle waardes te selecteren in betreffende listbox.

Dat kan op volgende manier:

code:

<script type="text/javascript">
function multipleSelectAll( frm ) {
    args = multipleSelectAll.arguments;
    for(i=1;i<args.length;i++) {
        el = frm.elements[args[i]];
        if( el ) {
            if( el.type == "select-multiple" ) {
                for(x=0;x<el.options.length;x++) {
                    el.options[x].selected = true;
                }
            }
        }
    }
    return true;
}
</script>

<form onsubmit="return multipleSelectAll( this, 'listbox', 'listbox2');">
<select name="listbox" multiple>
    <option value="1">Optie 1</option>
    <option value="3">Optie 2</option>
</select>
<select name="listbox2" multiple>
    <option value="1">Optie 1</option>
    <option value="3">Optie 2</option>
</select>
</form>

[McVirusS]

Ik wil trouwens graag m'n code uitleggen als je daar behoefte aan hebt, dan heb je er zelf ook nog wat aan in plaats van dat je het klakkeloos overneemt enzo .

[Verwijderd]

McVirusS schreef op 15 april 2003 @ 13:59:
Ik wil trouwens graag m'n code uitleggen als je daar behoefte aan hebt, dan heb je er zelf ook nog wat aan in plaats van dat je het klakkeloos overneemt enzo .

Ik snap je code helemaal Ga het morgen meteen uitproberen. Nog bedankt...;)

[Verwijderd]

Werkt perfect dat stukje code...echter : hoe krijg ik nu de items weer in een db ? Ik krijg met Request.Form dus de items gescheiden door komma's als string terug. Moet je dan met een (zelfgeschreven) functie die string doorlopen of kan dat ook makkelijker ?

[McVirusS]

Verwijderd schreef op 16 April 2003 @ 10:32:
Werkt perfect dat stukje code...echter : hoe krijg ik nu de items weer in een db ? Ik krijg met Request.Form dus de items gescheiden door komma's als string terug. Moet je dan met een (zelfgeschreven) functie die string doorlopen of kan dat ook makkelijker ?

Wat je vanzelfsprekend moet doen is die string splitten op komma en dan door de array die dan is ontstaan heenlopen. Er is zover ik weet geen makkelijkere methode (vind dat al vrij simpel ). Succes!