{% load static %} <div class="modal fade" id="add-sub-modal"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Add Storage</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <form action="" method="post"> {% csrf_token %} <div class="modal-body"> <label for="add-storage-name" class="form-label">Storage Name</label> <div class="input-group has-validation"> <input value="{{form.storage_name.value}}" class="form-control{% if form.storage_name.errors or form.non_field_errors %} is-invalid{% endif %}" id="add-storage-name" name="{{form.storage_name.name}}" type="text" aria-describedby="validationStorageName" required> <div id="validationStorageName" class="invalid-feedback"> {% for msg in form.storage_name.errors %} {{msg}} {% endfor %} </div> </div> <label for="{{form.responsible.id_for_label}}">Responsible</label> <div class="input-group has-validation dropdown"> <span class="input-group-text" id="add_storage_username_prepend">@</span><input autocomplete="off" data-bs-toggle="dropdown" type="text" value="{{form.responsible.value}}" class="form-control{% if form.responsible.errors or form.non_field_errors %} is-invalid{% endif %}" id="{{form.responsible.id_for_label}}" name="{{form.responsible.name}}" aria-describedby="add_storage_username_prepend validationServerUsernameFeedback" required> <ul class="dropdown-menu" aria-labelledby="{{form.responsible.id_for_label}}" id="{{form.responsible.id_for_label}}-ac-dropdown"> </ul> <div id="validationServerUsernameFeedback" class="invalid-feedback"> {% for msg in form.responsible.errors %} {{msg}} {% endfor %} </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> <input type="submit" class="btn btn-primary" value="Add Storage" name="submit-add-storage"> {% if form.non_field_errors %} {% for error in form.non_field_errors %} <p class="text-danger text-center">{{ error }}</p> {% endfor %} {% endif %} </div> </form> </div> </div> </div>