function setEventsCgDrop( liContainer ){
	// On attache l'événement clic sur tous les éléments de la liste de valeurs
	$$(liContainer + ' li').invoke('observe', 'click', function(e){

	    // on empêche l'événement par défaut de se produire 
	    //(comme aller en haut de la page à cause du href="#")
	    e.stop();
	
	    var element = e.element();
	    var li = element.up('li.cg-drop-element') || element;
	    var oContainer = element.up('.cg-drop-container');
	    var oHidden = oContainer.down('input.cg-drop-selected-value');
	    var oLabel = oContainer.down('.cg-drop-selected-label');
	    
	    // On met à jour la valeur qui a été cliquée
	    var sLabel = li.down('a.cg-drop-label').innerHTML;
	    var sValue = li.down('span.cg-drop-value').innerHTML;
	    
	    oLabel.update(sLabel);
	    oHidden.value = sValue;

	    element.up('.cg-drop-box').setStyle({'display' : 'none'});
	    // On lève l'événement comme quoi la valeur a été changée
	    oContainer.fire(oHidden.readAttribute('name') + ':change', {label : sLabel, value : sValue});
	});
}

document.observe('dom:loaded', function() {

	$$('body').first().observe('click', function(e) {
		var element = e.element();
		
		var oContainer = element.up('.cg-drop-container');
		
		if(!oContainer && !element.hasClassName('cg-drop-container')) {
			$$('.cg-drop-container ul').invoke('setStyle', {display: 'none'});
		}
	
	});

	
    $$('.cg-drop-container').invoke('observe', 'click', function(e){
        
    	$$('.cg-drop-container ul').invoke('setStyle', {'display' : 'none'});
        /* Code pour faire "popper" la liste de valeurs */
        var element = e.element();
        var oContainer = element.up('.cg-drop-container') || element;
        var oList = oContainer.down('ul.cg-drop-box');
        
        oList.setStyle({display:'block'});
    });
    
    setEventsCgDrop('.cg-drop-container');
});
