title: Dynamic Modal Data with Twig
body: <p>I am display a list of users using Twig:</p>
  
  <pre><code>{% for user in user.users %}
      &lt;div class="row user" data-id="{{ user.id }}"&gt;
          &lt;div class="col"&gt;{{ user.firstname }} {{ user.lastname }}&lt;/div&gt;
          &lt;div class="col"&gt;{{ user.email }}&lt;/div&gt;
          &lt;div class="col"&gt;{{ user.lastLogin|date("F j, Y \\a\\t g:i a") }}&lt;/div&gt;
      &lt;/div&gt;
  {% endfor %}
  </code></pre>
  
  <p>When the user clicks on this row, I would like a modal dialog to open with additional details about this specific user.</p>
  
  <p>I have considered simply including the modal within the for loop. However, if the list contains several hundred users, I do not want to render all of this additional data on every page load.</p>
  
  <p>My thought was to do something like this:</p>
  
  <pre><code>$('body').on('click', '.user', function() {
    $('#user').modal();
  });
  </code></pre>
  
  <p>But I am not sure how to dynamically render only the clicked user's data in the modal via twig:</p>
  
  <pre><code>&lt;div class="modal fade" id="user" tabindex="-1" role="dialog"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              {{ user.firstname }} //additonal data for a given user
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>