{% if results %}
  <ul class="list-unstyled mb-0" id="user_search_results_list_{{ field }}">
    {% for item in results %}
      <li class="py-1 d-flex justify-content-between align-items-center" data-user-id="{{ item.id }}" data-user-text="{{ item.text|escapejs }}" data-user-grade="{{ item.grade|default_if_none:''|escapejs }}">
        <div class="flex-grow-1">
          {{ item.text|escape }}
          {% if item.grade %}
            <small class="text-muted ms-2">{{ item.grade|escape }}</small>
          {% endif %}
        </div>
        <div>
          <button type="button" class="btn btn-sm btn-primary user-add-btn" data-user-id="{{ item.id }}" data-user-text="{{ item.text|escapejs }}" data-user-grade="{{ item.grade|default_if_none:''|escapejs }}">Add</button>
        </div>
      </li>
    {% endfor %}
  </ul>
  {% if results %}
    <div class="mt-2 text-end">
      <button type="button" class="btn btn-sm btn-outline-success user-add-all-btn" data-field="{{ field }}">Add all results</button>
    </div>
  {% endif %}
{% else %}
  <div><em>No users found</em></div>
{% endif %}