[RUBY] Mettre en œuvre la fonction de classement par étoiles en utilisant Raty dans Rails 6

Mise en œuvre de la fonction de classement par étoiles en utilisant raty sur rails6.

Tout d'abord, mettez Jquery https://qiita.com/masahisa/items/eaacb0c3b82f4a11fc13

Veuillez introduire jquery en faisant référence à cela. Devenir rails6 Il est facile d'oublier la description de $ yarn add jquery, alors soyez prudent.

Enregistrer l'image d'étoile depuis github https://github.com/wbotelhos/raty/tree/master/lib/images Enregistrez ceci dans l'application / les actifs / les images.

Copiez également le code javascript de github Puisqu'il n'y a pas de dossier appelé app / assets / javascripts dans rails6, Créez un dossier appelé javascripts dans app / assets. Créez un fichier aplication.js en dessous et collez-y tout le code copié à partir de github.

dans app / assets / config / manifest.js

//= link_directory ../javascripts .js

Ajouter.

dans app / layouts / application.html.erb

<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

Ajouter.

Il s'agit du paramètre d'environnement. Veuillez noter que la méthode est très différente sauf pour les rails6. (Je ne sais pas si cette méthode est correcte même en 6, mais j'ai pu la lire avec ça.)

Implémentation des fonctions suivantes.

Colonne de taux ajouté

rails g migration AddRateToEvaluations rate:float           ↓ rails db:migrate

Sous la forme de la vue, vous souhaitez ajouter une fonction de classement par étoiles

  <div class="form-group row" id="star">

<% = f.label: rate, 'Évaluation complète', classe: 'col-md-3 col-form- label' %> <%= f.hidden_field :rate, id: :review_star %>

<! - Évaluation javascript->

Décris. Le but est de définir review_star pour id dans hidden_field. Chargez l'image étoile enregistrée dans la partie Js.

N'oubliez pas d'autoriser le paramètre de taux sur le contrôleur. Vous devriez maintenant être prêt à taper avec une étoile.

Pour le moment, je vais également inclure le code qui affiche les données saisies. Dans mon cas, il y a une colonne de commentaires dans le tableau des évaluations, et le modèle de publication et le modèle d'utilisateur sont associés l'un à l'autre, veuillez donc l'utiliser comme référence uniquement.

   <tbody>
     <% @evaluations.each do |evaluation| %>
    <tr>
     <td><%= evaluation.comment %></td>
     <td>
     <a href="/users/<%= evaluation.user.id %>">
    <%= evaluation.user.nickname %>
   </a></td>

<! - Classement par étoiles->

      <% end %>

<! - / Classement par étoiles->

  </tr>

c'est tout.

https://gyazo.com/4e0cd5b4b5dc11d134bc65e6a7b7db74

C'est l'image. Il n'y a pas d'article sur les rails6, et je l'ai fait de force en référence à des articles autres que 6, donc je pense que la bonne réponse est différente.

Recommended Posts

Mettre en œuvre la fonction de classement par étoiles en utilisant Raty dans Rails 6
Implémenter la fonction d'application dans Rails
Implémenter une fonction de connexion simple dans Rails
[Rails] Comment mettre en œuvre le classement par étoiles
Implémenter la fonction de téléchargement CSV dans Rails
[Rails] Implémenter le classement par étoiles (entrée, sauvegarde, affichage)
Implémenter des transitions de boutons à l'aide de link_to dans Rails
Les rails 6 (avec Webpacker en standard) implémentent la fonction de classement par étoiles
Créer une fonction d'authentification dans l'application Rails à l'aide de devise
Implémenter un bouton de partage dans Rails 6 sans utiliser Gem
Markdown implémenté dans Rails
Implémenter la fonction de recherche de publication dans l'application Rails (méthode where)
[Rails] Implémentez la fonction d'enregistrement / suppression de carte de crédit dans PAY.JP
[Rails] Implémenter la fonction de recherche d'utilisateurs
Japaneseize en utilisant i18n avec Rails
Implémenter l'authentification LTI dans Rails
Implémenter la fonction de catégorie en utilisant l'ancêtre
[Rails] Implémenter la fonction de publication d'images
Implémentez la fonction de connexion dans Rails simplement avec le nom et le mot de passe (1)
Implémentez la fonction de connexion dans Rails simplement avec juste un nom et un mot de passe (2)
[Rails] Implémenter la fonction de fin d'événement (suppression logique) en utilisant la paranoïa (gem)
Implémentez la fonction de connexion simplement avec le nom et le mot de passe dans Rails (3)
Implémenter la fonction d'enregistrement des utilisateurs et la fonction d'enregistrement de l'entreprise séparément dans Rails concevoir
[Rails] Implémentation d'une fonction de demande / d'approbation d'adhésion à la communauté à l'aide d'associations plusieurs-à-plusieurs
Ajoutez une fonction de recherche dans Rails.
Implémenter la fonction PHP implode en Java
Implémenter un formulaire de contact dans Rails
[Rails] Implémentation d'une nouvelle fonction d'enregistrement au format assistant à l'aide de devise
[Rails] Un moyen simple d'implémenter une fonction d'auto-introduction dans votre profil
J'ai essayé d'implémenter le traitement Ajax de la fonction similaire dans Rails
[Procédure d'implémentation] Créer une fonction d'authentification utilisateur à l'aide de sorcellerie dans Rails
Comment implémenter la fonctionnalité de recherche dans Rails
[Rails] Restrictions de fonction dans l'appareil (connexion / déconnexion)
Comment mettre en œuvre un diaporama en utilisant Slick in Rails (un par un et plusieurs par un)
Comment implémenter la fonctionnalité de classement dans Rails
Pour implémenter la publication d'images à l'aide de rails
[Rails] Implémentation de la fonction de recherche en utilisant le ransack de gem
[Rails] Implémentation de la fonction d'agrandissement d'image à l'aide de lightbox2
[Rails] Exécutez LINE Bot dans un environnement local à l'aide de ngrok
Implémentez la fonction de recherche de correspondance partielle sans utiliser Ransuck
Mettre en œuvre la fonction de catégorie de produit en utilisant l'ascendance ① (Préparation)
Comment mettre en œuvre la fonction de chapelure avec Gretel
Flux pour implémenter la fonction de publication d'images à l'aide d'ActiveStorage