[JS] option selecteren m.b.v. selectChain

[radem205]

Hey,

Voor het wijzigen van gegevens in de database gebruik ik, zoals gewoonlijk, een html formulier waarin enkele selectboxes zijn opgenomen.

De ene selectbox is afhankelijk van de andere (bijv.: bij het selecteren van een bedrijf komen de contactpersonen van dat bedrijf in de selectbox eronder). Om dit te bewerkstelligen gebruik ik dit script (http://remysharp.com/2007...te-multiple-select-boxes/) i.c.m. jquery.
Nu werkt dit allemaal erg goed, echter bij het wijzigen van de gegevens in de database dienen de juiste options in de verschillende selectboxes geselecteerd te zijn wanneer met de wijzigen pagina opent.

Voorbeeld:

Database:

Organisatie	2
Contactpersoon	4
Vacature	12

(de nummers in bovenstaande tabel zijn de nummers corresponderend met de id's in de verschillende mysql tabellen)

Nu is het probleem dat wanneer ik bovenstaand script gebruik en de selectbox "Organisatie" een bepaalde optie selecteerd (in dit geval met id=2) dat automatisch de 2 overige selectboxes gevuld worden aan de hand van de selectChain javascript. Nu is dit normaal gesproken ok, maar omdat ik graag ook de ingevoerde contactpersoon en vacature geselecteerd wil hebben (aan de hand van de mysql waardes) is dat in dit geval minder gewenst.

Dit is de code die het script aanroept:

JavaScript:

$(function () {
        var cat = $('#organisaties');
        var el = $('#contactpersonen');
        var vac = $('#vacatures');
        
        cat.selectChain({
            target: el,
            url: 'inc/select-chain.php?id=1',
            data: { ajax: true },
        }).trigger('change');

        cat.selectChain({
            target: vac,
            url: 'inc/select-chain.php?id=2',
            data: { ajax: true }
        }).trigger('change');
});

Ik heb geprobeerd om door middel van onderstaande code het geheel werkend te krijgen, maar om één of andere reden functioneert hierdoor het hele script niet meer:

JavaScript:

$('#organisaties').change(function () {
        var cat = $('#organisaties');
        var el = $('#contactpersonen');
        var vac = $('#vacatures');
        
        cat.selectChain({
            target: el,
            url: 'inc/select-chain.php?id=1',
            data: { ajax: true },
        }).trigger('change');

        cat.selectChain({
            target: vac,
            url: 'inc/select-chain.php?id=2',
            data: { ajax: true }
        }).trigger('change');
});

Weet iemand hoe ik dit kan oplossen?

Overigens hoop ik dat jullie het verhaal snappen, aangezien ik het lastig vind om het goed uit te leggen.

[TeeDee]

Weet niet hoe jQuery daar exact mee omgaat, maar hoort de , achter de } op regel 9 van je eerste stukje code daar wel te staan?

Verder begrijp ik je vraagstelling niet helemaal. Misschien als je een online demo neer kan zetten dat het e.e.a. duidelijk wordt.

[ Voor 34% gewijzigd door TeeDee op 19-05-2009 08:56 ]

[Bosmonster]

Heeft die selectChain plugin (die ik niet ken, dus weinig over kan zeggen) geen selectLoaded event oid? Zodat je de boxjes 1 voor 1 kunt populeren? Want wat je nu doet gaat uiteraard niet werken, want je probeert een optie te selecteren in een selectbox die nog niet is gevuld. Je zult moeten weten wanneer het populeren van de selectboxes klaar is.

edit: die selectChain plugin is wel heel erg basic. Je zou eventueel wat in die code kunnen hacken om het event toe te voegen, zodat je dat kunt aanspreken.

[ Voor 58% gewijzigd door Bosmonster op 19-05-2009 08:58 ]