<button type="button" class="btn btn-primary" data-mdb-ripple-init data-mdb-modal-init

                    data-mdb-target="#user_modal" id="create_user_btn">

                    Create User

                </button>

​

<div class="modal fade" id="user_modal" tabindex="-1" aria-hidden="true">

        <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">

            <div class="modal-content">

                <div class="modal-header">

                    <h5 class="modal-title">Create User</h5>

                </div>

                <div class="modal-body py-2">

                    <form id="user_form" data-method="POST" autocomplete="off" novalidate>

                        <input type="hidden" id="user_id">

                        <div class="row my-2">

                            <div class="col-12">

                                <label for="user_name" class="form-label fw-bold text-dark mb-1">User Name:</label>

                                <input type="text" class="form-control m-0" id="user_name" placeholder="Enter Name"

                                    aria-label="User Name" aria-describedby="user_name" autocompleted="">

                                <small class="error-message text-danger" id="user_name_err_msg"></small>

                            </div>

                        </div>

                        <div class="row my-2">

                            <div class="col">

                                <label for="user_environment_select"

                                    class="form-label fw-bold text-dark">Environment:</label>

                                <select class="text-capitalize" id="user_environment_select" data-mdb-select-init

                                    data-mdb-option-height="25"></select>

                                <small class="error-message text-danger" id="user_environment_select_err_msg"></small>

                            </div>

                        </div>

                    </form>

                </div>

                <div class="modal-footer py-2">

                    <a class="me-auto d-none cursor-pointer" id="toggle_user_change_password">Change password?</a>

                    <button type="button" class="btn btn-secondary text-capitalize fw-bold" data-mdb-ripple-init

                        data-mdb-dismiss="modal">Cancel</button>

                    <button type="submit" class="btn btn-primary text-capitalize fw-bold float-end" form="user_form"

                        id="user_form_submit_btn" data-mdb-ripple-init>Submit</button>

                </div>

            </div>

        </div>

    </div>