Utilizzare jQuery con Rails

by Simone Carletti — Leave a Comment

Nell'articolo precedente abbiamo visto come è possibile usare jQuery con Rails. Sebbene l'utilizzo di Rails per creare applicazioni dinamiche in AJAX vada oltre lo scopo dell'articolo originale, per verificare il corretto funzionamento di jQuery proviamo a creare un semplice guestbook composto da una sola pagina con la possibilità di inserire messaggi via AJAX.

Partiamo da zero, creando un nuovo progetto chiamato jguestbook. Il sorgente dell'applicazione, a scopo didattivo, è allegato a questo articolo.

$ rails jguestbook

create
create  app/controllers
create  app/helpers
create  app/models
create  app/views/layouts
...
create  doc/README_FOR_APP
create  log/server.log
create  log/production.log
create  log/development.log
create  log/test.log

$ cd jguestbook

Creiamo il modello Message ed il rispettivo controller che si occuperà dell'inserimento e del salvataggio dei messaggi. Per comodità, utilizziamo il generator scaffold.

$ ruby script/generate scaffold message username:string subject:string body:text

exists  app/models/
exists  app/controllers/
exists  app/helpers/
create  app/views/messages
exists  app/views/layouts/
...
create    db/migrate
create    db/migrate/20090202232010_create_messages.rb

$ rake db:migrate

==  CreateMessages: migrating =================================================
-- create_table(:messages)
   -> 0.0027s
==  CreateMessages: migrated (0.0028s) ========================================

Apriamo il file routes.rb e mappiamo la root del sito all'azione MessageController#index. Assicuriamoci di rimuovere la pagina public/index.html o Rails continuerà a mostrare come homepage la pagina di default anche se è configurata un'azione specifica. Avviando il server dovremmo vedere una pagina simile allo screenshot seguente.

Homepage di jGuestbook

Anche se pressoché priva di appeal, l'applicazione è perfettamente funzionante. Possiamo inserire nuovi messaggi, modificarli e rimuoverli. Provare per credere.

Pagina elenco Messaggi

Pagina di visualizzazione Messaggio

E' arrivato il momento di integrare jQuery e qualche funzionalità AJAX all'interno della nostra applicazione. Come prima cosa installiamo il plugin ed includiamo jQuery all'interno file di layout nella cartella  /app/views/layouts/messages.html.erb.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
  <title>Messages: <%= controller.action_name %></title>
  <%= stylesheet_link_tag 'scaffold' %>
  <%= javascript_include_tag :defaults %>
</head>
<body>

<p style="color: green"><%= flash[:notice] %></p>

<%= yield  %>

</body>
</html>

Ora modifichiamo la vista dell'azione #index per consentire l'inserimento di un nuovo messaggio via AJAX.

Pagina di inserimento Messaggio

L'esempio finale completo è allegato a questo articolo. E' bene sottolineare che l'applicazione ha uno scopo puramente dimostrativo e non include nessun controllo sulla validità dei dati in ingresso. Il suo obiettivo è semplicemente dimostrare l'integrazione di jQuery in un'applicazione Rails.

Related Posts