/ / Menu utilisant l'accordéon jQuery: permet de faire fonctionner les liens d'en-tête - jquery, ruby-on-rails, callback, accordéon

Menu utilisant l'accordéon jQuery: permet de faire fonctionner les liens d'en-tête - jquery, ruby-on-rails, callback, accordéon

J'essaie d'utiliser le module accordéon Jquery UI pour créer une barre latérale contenant des catégories d'objets (en-têtes) qui, lorsqu'elles sont cliquées, affichent les sous-catégories (contenu).

L'accordéon lui-même fonctionne bien: lorsque je clique sur une catégorie, une nouvelle section contenant les liens vers les différentes sous-catégories "s'affiche, MAIS les liens vers les catégories principales ne fonctionnent plus. J'aimerais un clic sur une catégorie pour faire DEUX choses: changer le accordéon correctement ET ouvrez le lien.

J'ai cherché sur le Web pendant 2 heures, et le seulL’indice que j’ai trouvé consistait à utiliser un rappel à l’événement de modification de l’accordéon, mais je suis extrêmement novice dans jQuery / Javascript, je ne sais donc pas comment faire cela ou si c’est la meilleure option.

Si j'utilise "mouseover" pour déclencher l'accordéon,alors tout fonctionne correctement: l'événement de clic sur une catégorie ouvre toujours la page de catégorie. Dois-je utiliser mouseover ou existe-t-il une solution utilisant click comme événement? (le problème est que jquery génère un événement côté client, alors que le lien doit générer un événement côté serveur)

Vous pouvez vérifier ce que je veux dire en direct ici (cliquer sur le "Média" dans la barre latérale gauche devrait ouvrir les sous-catégories mais aussi la liste des objets dans les catégories de Médias, alors que cliquer sur le sous-menu "livres" fonctionne bien).

Un grand merci pour toute aide!

Réponses:

2 pour la réponse № 1

Au lieu d'utiliser des liens dans les en-têtes de l'accordéon, utilisez l'événement change de l'accordéon.

http://jqueryui.com/demos/accordion/#event-change

$( "#accordion" ).accordion({
changestart: function (event, ui) {
var href = ui.newHeader.attr( "href" );
// do something with href
}
});

0 pour la réponse № 2

http://jqueryui.com/demos/accordion/#option-navigation

$( ".selector" ).accordion({ navigation: true });