{"id":37354,"date":"2023-07-12T06:16:59","date_gmt":"2023-07-12T06:16:59","guid":{"rendered":"https:\/\/www.railscarma.com\/?p=37354"},"modified":"2023-07-20T04:44:16","modified_gmt":"2023-07-20T04:44:16","slug":"come-utilizzare-la-gemma-bozzolo-nei-binari-7","status":"publish","type":"post","link":"https:\/\/www.railscarma.com\/it\/blog\/come-utilizzare-la-gemma-bozzolo-nei-binari-7\/","title":{"rendered":"Come utilizzare la gemma bozzolo in Rails 7?"},"content":{"rendered":"
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

La gemma Cocoon \u00e8 un potente strumento che semplifica la gestione dei moduli nidificati nelle applicazioni Rails. Con Bozzolo<\/a>, puoi gestire facilmente aggiunte e rimozioni dinamiche di campi modulo nidificati, offrendo un'esperienza utente fluida. In questo articolo esploreremo come utilizzare il file Gemma Cocoon in un'applicazione Rails 7<\/strong> attraverso un esempio pratico.<\/span><\/p>

Installazione e configurazione di Cocoon Gem<\/b><\/h3>

Per iniziare, installiamo e configuriamo Cocoon gem in un'applicazione Rails 7.<\/span><\/p>

Aggiungi la gemma Cocoon al tuo Gemfile:<\/span><\/p>

gemma 'bozzolo'<\/strong><\/p>

Esegui il comando bundle per installare il gem:<\/span><\/p>

installazione del pacchetto<\/strong><\/p>

Richiedi Cocoon nel file manifest JavaScript (<\/span>app\/javascript\/packs\/application.js<\/span>):<\/span><\/p>

\/\/= richiede bozzolo<\/strong><\/p>

Assicurati di avere jQuery installato. In caso contrario, aggiungilo al tuo Gemfile:<\/span><\/p>

gemma 'jquery-rails'<\/strong><\/p>

Configura jQuery nella tua applicazione aggiungendo la seguente riga al tuo file manifest JavaScript:<\/span><\/p>

\/\/= richiede jquery3<\/strong><\/p>

\u00a0<\/p>

Implementazione di moduli nidificati con Cocoon<\/b><\/h3>

Supponiamo di avere una semplice applicazione Rails che modella un post di blog e i relativi commenti associati. Utilizzeremo Cocoon per gestire la creazione e la rimozione dei commenti all'interno del modulo del post del blog.<\/span><\/p>

Configurare le associazioni:<\/span><\/p>

# app\/modelli\/post.rb<\/strong>
class Post < ApplicationRecord
has_many: commenti
accetta_nested_attributes_for :comments,allow_destroy: true
FINE<\/strong><\/p>

#app\/models\/comment.rb
<\/strong>classe Commento < ApplicationRecord
<\/strong>appartiene_a :post
<\/strong>FINE<\/strong><\/p>

Costruisci il modulo nidificato nella visualizzazione del modulo post:<\/span><\/p>

# app\/views\/posts\/_form.html.erb
<\/strong><%= form_with(modello: post) do |f| %>
<\/strong><%= f.etichetta :titolo %>
<\/strong><%= f.campo_testo :titolo %>
<\/strong><%= f.fields_for :comments do |comment_fields| %
<\/strong><%= visualizza 'campi_commento', f: campi_commento %>
<\/strong><% fine %><\/strong><\/p>

<%= link_to_add_association 'Aggiungi commento', f, :comments %>
<\/strong><%= f.invia %>
<\/strong><% fine %><\/strong><\/p>

Crea un partial per i campi dei commenti:<\/span><\/p>

# app\/views\/posts\/_comment_fields.html.erb
<\/strong><div class="”nested-fields”">
<\/strong><%= f.label :contenuto %><\/strong><%= f.campo_testo :contenuto %>
<\/strong><%= link_to_remove_association 'Rimuovi commento', f %>
<\/strong><\/div><\/strong><\/p>

Aggiungi il JavaScript necessario per abilitare la funzionalit\u00e0 Cocoon:<\/span><\/p>

\/\/ app\/javascript\/packs\/application.js
<\/strong>$(documento).on('turbolinks:carico', funzione() {
<\/strong>$('.nested-fields').cocoon();
<\/strong>});

<\/strong><\/p>

Lavorare con moduli nidificati utilizzando Cocoon<\/b><\/h3>

Ora che abbiamo implementato le configurazioni necessarie, vediamo Cocoon in azione.<\/span><\/p>

  1. Quando carichi il modulo del post del blog, vedrai il collegamento "Aggiungi commento".<\/span><\/li>
  2. Facendo clic su "Aggiungi commento" verr\u00e0 aggiunto dinamicamente un nuovo set di campi di commento al modulo.<\/span><\/li>
  3. Per rimuovere un commento, fare clic sul collegamento "Rimuovi commento" associato a quel commento.<\/span><\/li>
  4. Una volta inviato il modulo, il post e i commenti associati verranno salvati nel database.<\/span><\/li><\/ol>

    Conclusione:\u00a0<\/b><\/h3>

    La gemma Cocoon semplifica la gestione dei moduli annidati nelle applicazioni Rails 7. Seguendo i passaggi descritti in questo articolo, puoi gestire senza problemi le aggiunte e le rimozioni dinamiche dei campi del modulo nidificati, migliorando l'esperienza dell'utente. Incorpora Cocoon nei tuoi progetti Rails per gestire in modo efficiente moduli complessi e migliorare la gestione dei dati. Sperimenta le sue varie opzioni e funzionalit\u00e0 di personalizzazione per soddisfare le tue esigenze specifiche. Stai cercando un partner affidabile per gestire le tue esigenze di sviluppo di Rails? Non guardare oltre. RailsCarma<\/a> offerte complete Servizi di sviluppo delle rotaie<\/a> che comprendono tutto, dalla progettazione iniziale all'implementazione e alla manutenzione.\u00a0<\/span><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t

    \r\n
    Articoli correlati<\/div>\r\n
    \r\n\r\n
    \r\n
    \r\n \r\n\r\n \"Gemma\r\n\r\n <\/a>\r\n <\/div>\r\n\r\n \r\n Cos'\u00e8 e come funziona Offliberty Ruby Gem <\/a>\r\n\r\n <\/div>\r\n
    \r\n
    \r\n \r\n\r\n \"Metodo\r\n\r\n <\/a>\r\n <\/div>\r\n\r\n \r\n Metodo Rails link_to: Guida completa con esempi <\/a>\r\n\r\n <\/div>\r\n
    \r\n
    \r\n \r\n\r\n \"Costruire\r\n\r\n <\/a>\r\n <\/div>\r\n\r\n \r\n Come costruire una piattaforma SaaS scalabile usando Ruby on Rails <\/a>\r\n\r\n <\/div>\r\n
    \r\n
    \r\n \r\n\r\n \"Ruby\r\n\r\n <\/a>\r\n <\/div>\r\n\r\n \r\n Ruby Regex Match Guide (2026) with Examples <\/a>\r\n\r\n <\/div>\r\n \r\n <\/div>\r\n\r\n