Dropdown ouvre une div avec des cases de sélection

Question

veuillez présenter des excuses pour le titre peu clair. Comment puis-je construire une solution comme sur cette page:

http://reisen.com/

Je veux une solution comme le champ déroulant pour les aéroports (Abflughäfen). Après avoir cliqué sur le menu déroulant, un panneau apparaît avec des cases à cocher. Après avoir sélectionné les cases, les éléments sélectionnés apparaissent dans la liste déroulante.

Y a-t-il des plugins pour jquery ou est-ce que je les code moi-même? Comment cela est-il fait?

Merci d'avance pour vos commentaires.

Answer 1

Ce n'est probablement pas assez compliqué qu'il repose sur un plugin.

1) Afficher le panneau lorsqu'ils cliquent sur le menu déroulant

$('#airport').change(function(){ 
    $('#panel').toggle(); 
}); 

2) Faire un événement bouton de fermeture qui figure sur ce qu'ils ont choisi

$('#close').button().click(function(){ 
    $('#panel').toggle(); 

    //figure out exactly what they checked off 
    var results = new Array(); 
    $('input[name="group"]:checked').each(function(){ 
     results.push($(this).val()); 
    }); 

    //append back to the select this list 
    $('#airport').append('<option value="bar">'+results.join(',')+'</option>'); 
}); 

Si vous voulez voir en action en forme simplifiée, regardez ici: http://jsfiddle.net/ryleyb/RHBcc/