# Render Bootstrap Modals

**URL:** <https://www.ruby-forum.com/t/render-bootstrap-modals/235109>\
**Category:** IT\
**Created:** [May 31, 2013, 11:44am UTC](https://www.ruby-forum.com/t/render-bootstrap-modals/235109 "2013-05-31T11:44:33Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![alcina](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/a587f6/32.png) [@alcina](https://www.ruby-forum.com/u/alcina)\
**Post date:** [May 31, 2013, 11:44am UTC](https://www.ruby-forum.com/t/render-bootstrap-modals/235109/1 "2013-05-31T11:44:33Z")

</div>

Ciao a tutti,  
non riesco a capire come renderizzare un oggetto preso da un’altro  
controller su delle finestre modali.

Ho una pagina con delle foto visualizzate in piccolo da delle thumbnail  
e cliccandoci sopra, volevo aprire un modale dove visualizzare la foto  
ad una risoluzione maggiore con alcune informazioni.

Ho questo controller con questi due metodi per la home page(index) e la  
foto(show)

class Photo  
def index  
@photos = […]  
end

def show  
@photo = url e info  
end  
end

mentre nelle view ho questo:

#index.html.erb

 \<%= link\_to "#showphoto", :data =\> {:toggle =\> "modal"} do %\> \<% @photos.each do |p| %\> - 
 \<%= image\_tag p.thumbnail %\> 
 \<% end %\> \<% end %\>
\<% render "shared/showphoto\_modal" %\>

#\_showphoto\_modal.html.erb

 \<%= image\_tag @photo.url %\> \<%= @photo.info %\> 

Il modale, messo in un “partial”, dovrebbe chiamare il metodo “show” per  
la foto selezionata ma non riesco a capire come gestire questa cosa …

---

<div class="post-metadata">

**Author:** ![albertobraschi](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/87869e/32.png) [@albertobraschi](https://www.ruby-forum.com/u/albertobraschi)\
**Post date:** [May 31, 2013, 12:14pm UTC](https://www.ruby-forum.com/t/render-bootstrap-modals/235109/2 "2013-05-31T12:14:13Z")

</div>

Il 31/05/13 11:44, Alberto B. ha scritto:

> Ciao a tutti,  
> non riesco a capire come renderizzare un oggetto preso da un’altro  
> controller su delle finestre modali.

mmm, nel codice ci sono parecchi problemi, entro nel dettaglio:

> end  
> end

due metodi ti servono per due azioni diverse, mentre col modal te ne  
basta una, oppure, se carichi il contenuto dei vari modal in ajax, ti  
serve una seconda azione che restituisca soltanto l’immagine e non tutto  
il layout. Nel tuo esempio comunque serve soltanto index

> ```
> </li>
> <% end %>
> 
> ```
> 
> \<% end %\>

qui hai solo 1 link\_to in cui inserisci tutte le foto, devi invece avere  
1 link per ogni foto che faccia riferimento ad 1 modal. Ed ogni link  
deve essere unico altrimenti non sa quale modal aprire.

> \<% render “shared/showphoto\_modal” %\>

qui manca un = (ovvero \<%= ) quindi questo partial non viene mostrato,  
ma forse un typo nella mail.  
Devi per poi specificargli cosa mostrare.

Un codice di esempio che dovrebbe funzionare (non l’ho provato):

 \<% @photos.each do |p| %\> - 
 \<%= link\_to "#showphoto\_#{p.id}", :data =\> {:toggle =\> "modal"} do %\> \<%= image\_tag p.thumbnail %\> \<% end %\> \<%= render "shared/showphoto\_modal", locals: { photo: p } %\> 
 \<% end %\> \<% end %\>

#\_showphoto\_modal.html.erb

 \<%= image\_tag photo.url %\> \<%= photo.info %\> 

> Il modale, messo in un “partial”, dovrebbe chiamare il metodo “show” per  
> la foto selezionata ma non riesco a capire come gestire questa cosa …

no, non chiama “show”, il metodo show viene mostrato se routes.rb sa  
della sua esistenza (ad esempio se c’ un “resources :photos”) e se apri  
la pagina relativa, es: /photos/3  
renderizzando un partial in index.html.erb rimani sempre dentro il  
metodo index. La guida ufficiale sulle rotte fatta molto bene e  
sicuramente riesce a spiegarsi meglio di me 🙂

> **[Rails Routing from the Outside In — Ruby on Rails Guides](https://guides.rubyonrails.org/routing.html)**
>
> This guide covers the user-facing features of Rails routing.After reading this guide, you will know: How to interpret the code in config/routes.rb. How to construct your own routes, using either the preferred resourceful style or the match method....

---

<div class="post-metadata">

**Author:** ![albertobraschi](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/87869e/32.png) [@albertobraschi](https://www.ruby-forum.com/u/albertobraschi)\
**Post date:** [May 31, 2013, 12:33pm UTC](https://www.ruby-forum.com/t/render-bootstrap-modals/235109/3 "2013-05-31T12:33:42Z")

</div>

Grazie Tommaso.  
Il codice che ho scritto e esemplificativo ed era solo per dimostrare  
come avevo improntato i controller e le view.

Il metodo show esiste per visualizzare la view della foto. Il modale  
serviva solo per avere una “preview” senza mandare l’utente avanti e  
indietro dalle diverse pagine.

All’inizio avevo fatto come dici tu, mettendo un modale per ogni foto e  
caricando nella index sia le varie foto in alta risoluzione che le info  
per ogni foto, ma pensavo che ci fosse un modo migliore per farlo.

Nel modo che hai consigliato tu (se ho capito bene), e come avevo fatto,  
appesantisco la index perchè devo caricare più dati.  
Volevo invece caricare la foto (in alta ris.) e le info solo al clic  
della foto selezionata, andando a renderizzare un “partial” dalla vista  
show.

Forse sto complicando io le cose. Ma chiedo se qualcuno di voi ha dei  
suggerimenti 🙂  
Grazie cmq ancora della risposta

Alberto

---

<div class="post-metadata">

**Author:** ![albertobraschi](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/a/87869e/32.png) [@albertobraschi](https://www.ruby-forum.com/u/albertobraschi)\
**Post date:** [May 31, 2013, 12:46pm UTC](https://www.ruby-forum.com/t/render-bootstrap-modals/235109/4 "2013-05-31T12:46:56Z")

</div>

Il 31/05/13 12:33, Alberto B. ha scritto:

> per ogni foto, ma pensavo che ci fosse un modo migliore per farlo.
> 
> Nel modo che hai consigliato tu (se ho capito bene), e come avevo fatto,  
> appesantisco la index perch devo caricare pi dati.  
> Volevo invece caricare la foto (in alta ris.) e le info solo al clic  
> della foto selezionata, andando a renderizzare un “partial” dalla vista  
> show.
> 
> Forse sto complicando io le cose. Ma chiedo se qualcuno di voi ha dei  
> suggerimenti 🙂

ok, il metodo c’ e consiste nel caricare il contenuto del body del  
modal via ajax, devi inserire in data-target l’id del modale da mostrare  
e in href l’url della pagina da mostrare dentro modal-body. questo  
l’esempio preso dalla pagina di bootstrap:

click  
me

in href puoi ad esempio mettere l’url corrispondente allo show della  
foto, devi solo stare attento che l’azione show restituisca solo il  
contenuto html che andr nel modale e non tutto il layout

quel che vorrei sottolineare che con un partial non renderizzi  
un’azione di un controller, pi semplicemente dividi la vista di  
un’action (nel tuo caso index) in pi file

ciao