Mettre à jour la liste déroulante avec la sélection des boutons radio en utilisant jquery

Il s'agit donc d'un suivi de cette publication . J'ai besoin de remplacer certains menus déroulants par des boutons radio sans modifier le code HTML. Dans le post que j'ai lié plus tôt, quelqu'un a trouvé une solution Jquery vraiment intelligente qui remplace avec succès le menu déroulant avec des boutons radio et met à jour la sélection déroulante lorsque l'un des boutons radio est sélectionné.

Cependant, lorsque je l'ai implémenté avec le plugin, les boutons radio apparaissent mais ils ne mettent pas à jour la valeur de la liste déroulante lorsqu'ils sont sélectionnés. Je soupçonne qu'il y a un conflit avec js ailleurs sur la page, mais après quelques essais et erreurs, je ne peux toujours pas comprendre ce qui se passe. Des idées? Le site en question peut être trouvé ici

Voici la solution originale de la publication précédente

Voici donc le code mis à jour:

<script type='text/javascript'> $(function(){ $("#options-1 option").each(function(i, e) { $("<input type='radio' name='r' />") .attr("value", $(this).val()) .attr("checked", i == 0) .click(function () { $("#options-1").val($(this).val()); }) .appendTo("#r"); $("#options-1").change(function(){ $("input[name='r'][value='"+this.value+"']").attr("checked","checked"); }); }); }); </script> 

Vous devez disposer de cette fonction en plus de votre code existant

 $("#d").change(function(){ $("input[name='r'][value='"+this.value+"']").attr("checked","checked"); });