Comment créer du javascript dynamic avec Ruby On Rails?

J’expérimente avec jQuery FullCalendar et Ruby On Rails, j’ai un modèle appelé Player. Je veux rendre un calendrier pour chaque joueur sur le modèle d’index.

$('#player1_calendar').fullCalendar({ // put your options and callbacks here }) 

Pour rendre le calendrier sur la vue

Comment puis-je append dynamicment un calendrier à chaque joueur afin de pouvoir l’appeler comme suit:

 
...

Je voudrais aborder cela différemment.

Le fait est que Rails est capable de renvoyer des données au format JSON, qui est un format de données natif pour JavaScript. Cela dit, vous pouvez écrire du JS statique et y append un sharepoint terminaison de données JSON dynamic.

L’algorithme général est le suivant:

  • Ajoutez un noeud final JSON qui fournit toutes les données nécessaires pour choisir les options dans chaque cas particulier: il peut s’agir d’un noeud final renvoyant les données de tous les lecteurs de la page donnée.
  • En HTML, surlignez la balise racine de la collection avec quelque chose: pour les options liées au comportement, j’utilise data- ; vous pouvez même fournir l’URL du noeud final dans la valeur d’atsortingbut: le fait est que vous devriez pouvoir concevoir un sélecteur pour les trouver.
  • Écrivez un code JavaScript statique qui recherche toutes les balises à l’aide du sélecteur conçu ci-dessus, interroge les données requirejses, puis utilise les données reçues pour appeler fullCalendar avec les options appropriées.

C’est un moyen général d’éliminer le besoin de JavaScript dynamic. Pour les solutions mono-place, c’est évidemment excessif, mais pour un usage fréquent, c’est plus pratique, car cela vous permet d’appliquer votre comportement sans générer de JS simple ni même insérer de JS dans la page, mais uniquement déclenché par le DOM.

C’est peut-être plus facile de le faire entièrement en Javascript:

Ajouter une classe à tous les éléments du calendrier:

 

Ensuite, parcourez-les tous et attachez votre calendrier complet:

 $('.player-calendar').each(function(idx, calendar) { $(calendar).fullCalendar({}); });