Test: AJAX dynamic selects

Jan Koehoorn schreef op 04.04.2007 12:20

@ Frank: aha, daar was ik vooral ook benieuwd naar, thanks!
@ Robert: meteen een tweede selectbox met alle mogelijkheden kan zeker, maar: stel dat iemand niets kiest uit box 1 en meteen iets kiest uit box 2. Dan zou in box 1 wel weer automatisch de juiste categorie gekozen moeten worden natuurlijk. Ga ik even over nadenken.

-> Is dat zo? Het is wel een mooi extra'tje vind ik, maar het hoeft niet. Stel dat ik appel kies uit box2, en ik wil dan bijvoorbeeld alle items zien die voldoen aan het criterium/ de criteria.

Het maakt dan niet uit of de 1e selectbox leeg is. -> Immers via je database is een appel al gekoppeld aan de categorie "fruit". Klik ik op zoeken bij appel, dan zal die alle appels weergeven.

Kan ik een item niet vinden in de 2e selectbox, dan kies ik fruit in de 1e en kijk opnieuw in de verkorte lijst. Zie ik hem nog niet, maak ik geen keuze in het 2e vak en kies zoeken. Ik krijg dan alles met als categorie "fruit".

Het is ook maar net waar je het voor wilt gebruiken, maar ik vind jou idee voor het bijwerken van selectbox 1 ook wel erg goed bedacht. Een soort van wisselwerking tussen beide selects.

Ze zijn inderdaad in mijn DB al gelinkt, dus dat zou het probleem niet zijn. Het gaat er meer om wat het meest gebruiksvriendelijk zou zijn. Als het gaat om grote opdrachten organiseer ik meestal een testsessie met de doelgroep, maar daar is het nu nog een beetje te vroeg voor. Vandaar dat jullie mogen proefkonijnen ;-)

@jan

Als het je lukt zou dat wel mooi zijn, maar je zit wel met 1 probleem dan. -> ik wil bloemkool kiezen, maar net boven bloemkool staat banaan (dus uit een andere categorie)
Ik klik verkeerd, je bovenste veld verspringt naar fruit, en ik kan bloemkool niet meer kiezen. -> moet eerst "geen" categorie selecteren, of "groente" en dan vervolgens alsnog bloemkool.
Dit is dus niet erg gebruiksvriendelijk.
Wat je evt wel kan doen is controleren of er een categorie is gekozen, zo ja -> niets veranderen als je een naam kiest. Zo nee -> Geef naast je 2e selectbox weer uit welke categorie het item komt. (wel lastig te maken, maar ik denk de meest gebruiksvriendelijke oplossing voor het vraagstuk)

Hallo,

Heel mooi voorbeeld van dynamische selects met AJAX. Een vraagje echter: is het ook mogelijk om meer dan 2 selects te linken?

Natuurlijk is dat mogelijk, er komt er dan 1 achter, en je hebt nog een link nodig vanuit de 2e select naar de 3e toe, maar dat gaat op dezelfde manier als in het voorbeeld van Jan.

Wel, ik ben dit aan het proberen. Ik constateer echter dat mijn 2de onchange niet werkt, waardoor mijn 3de select niet wordt aangemaakt.

 function init () {
            document.getElementById ('ctrl_country').onchange = function () {
                return handle_country (this.value);
            }
            document.getElementById('ctrl_region').onchange = function(){
               return handle_region(this.value);
            }
        }