Skip to content

Instantly share code, notes, and snippets.

@vvj5
Created July 2, 2015 00:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vvj5/e14911a8b66ebd3e1afa to your computer and use it in GitHub Desktop.
Save vvj5/e14911a8b66ebd3e1afa to your computer and use it in GitHub Desktop.
Trying to get modal to take an img url from the db and show it automatically when button is clicked
<div class="report-inner">
<h1>TOP ROOMS</h1>
<table class="report-container">
<table id="top_rooms">
<thead>
<tr>
<th>NAME</th>
<th>MAX OCC</th>
<th>IMAGE</th>
<th>LOCATION</th>
</tr>
</thead>
<tbody>
<% @top_rooms.each do |top_rooms| %>
<tr>
<td><%= top_rooms.first.name %></td>
<td><%= top_rooms.first.max_occupancy %></td>
<td>
<!-- Button for Image Modal -->
<a href="#image_show_modal" role="button" class="btn btn-default" data-toggle="modal">click to see image</a>
<!-- Modal HTML -->
<div id="image_show_modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
</div>
<div class="modal-body">
<!-- IMAGE LINK BELOW -->
<%= link_to top_rooms.first.imgurl %>
<p class="text-warning"><small>meeting room view</small></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">close</button>
</div>
</div>
</div>
</div>
</td>
<td><%= top_rooms.first.location %></td>
</tr>
<% end %>
</tbody>
</table>
</table>
</div>
<div class="report-inner">
<h1>ROOMS</h1>
<table class="report-container">
<table id="rooms">
<thead>
<tr>
<th>NAME</th>
<th>MAX OCC</th>
<th>ROOM NUMBER</th>
<th>IMAGE</th>
<th>LOCATION</th>
</tr>
</thead>
<tbody>
<tr><% @reports_rooms.each do |reports_rooms| %>
<td><%= reports_rooms.name %></td>
<td><%= reports_rooms.max_occupancy %></td>
<td><%= reports_rooms.room_number %></td>
<td><%= reports_rooms.imgurl %></td>
<td><%= reports_rooms.location %></td>
</tr>
<% end %>
</tbody>
</table>
</table>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment