CODEWITHSUNDEEP
ruby-on-railstwitter-bootstrap-3
Gregory Jaros
Gregory Jaros

Reputation: 145

rails, locals not passing to bootstrap modal partial

Okay so some weird stuff is going on with passing some local variables to a partial using the bootstrap modal feature.

I'm creating a calendar in a table. Each table cell represents a date in the month. In each of these cells is a button with the date for that cell marking it. The idea is when this button is clicked a modal will open up displaying a list of clients that have tasks that day to be done.

Here is my views/jobs/index.html.erb

<% count = 0 %>
  <% 5.times do %>
    <tr>
      <% 7.times do %>
        <td>
          <% date = @calender_days[count] %>
          <% client_set = create_client_set(date) %>
          <%= render partial: 'day', locals: {jobs: @jobs, count: count, date: date, client_set: client_set} %>
          <% client_set[0..2].each do |client| %>
            <%= User.find(client).username %><br />
          <% end %>
          <% count += 1 %>
        </td>
      <% end %>
    </tr>
  <% end %>

Here is the partial referenced in the render, my views/jobs/_day.html.erb

<button type="button" class="align-text-bottom btn btn-primary btn-xs" data-toggle="modal" data-target="#day-tasks">
  <%= date.strftime('%d') %>
</button>
<div class="modal fade" id="day-tasks" tabindex="-1" role="dialog" aria-labelledby="day-tasks-Label" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title" id="day-tasks-ModalLabel"><%= date.strftime('%m/%d') %></h4>
      </div>
      <div class="modal-body">
        <%= count %>
        <% client_set.each do |client| %>
          <h5><%= User.find(client).username %></h5>
        <% end %>
      </div>
      <div class="modal-footer">
        <button type="button" class="align-text-bottom btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>

Now the weird thing is this: <%= date.strftime('%d') %> for the button at the top of the modal evaluates correctly, where date = @calender_days[count] yet <%= count %> in the modal body evaluates to 0 across the whole calendar. Notice also that <%= date.strftime('%m/%d') %> in the modal-title evaluates to the first day in the calendar. So the partial is getting the values with the button receiving the correct values but for some reason the modal isn't getting them.

I'm really stumped, it makes no sense. Thank you all in advance for your help!

Upvotes: 0

Views: 269

Answers (1)

xploshioOn
xploshioOn

Reputation: 4125

Your problem is not about the counter value, the thing is that you are generating different modals with the same ID and when you click to open the modal, it always open the first, not the one that belongs to the button you set, and this is the one that has 0 on their value.

a simple solution could be just to concat the count value to the id of the modal and of course to the data-target of the button, so you need to change those two lines

<button type="button" class="align-text-bottom btn btn-primary btn-xs" data-toggle="modal" data-target="#day-tasks-<%= count %>">
...
    <div class="modal fade" id="day-tasks-<%= count %>" tabindex="-1" role="dialog" aria-labelledby="day-tasks-Label" aria-hidden="true">
    ...

or concatenate the date or something that is unique for that purpose.

Upvotes: 1

Related Questions