Вот пара групп скринов – на первой группе скринов я показываю то, что на localhost:8080/rest_admin до нажатия на кнопку, на второй группе скринов то, что после

ДО НАЖАТИЯ:

ПОСЛЕ НАЖАТИЯ:

...ничего не изменилось! То есть модальная форма в html-коде была и по-прежнему (после нажатия) есть, но не отображается, не всплыла на экран!

Вот скрин –

 

 

//отрывок js-скриптового кода из rest_admin.html:

for(key in content) {

           let tr = document.createElement('tr');

           tr.innerHTML = `

                   <td id="edit_id#${content[key].id}"><span>${content[key].id}</span></td>

           <td id="edit_role#${content[key].id}"><span>${content[key].role}</span></td>

           <td id="edit_name#${content[key].id}"><span>${content[key].name}</span></td>

           <td id="edit_password#${content[key].id}"><span>${content[key].password}</span></td>

           <td id="edit_email#${content[key].id}"><span>${content[key].email}</span></td>

           <td>

                                       <button type="button" class="btn btn-info btn-sm" data-toggle="modal"

                                               th:attr="data-target='#userId-' + ${content[key].id}"">${content[key].id}</button>

                                       <!-- Modal// -->

                               <div class="modal fade" th:attr="id='userId-'+${content[key].id}" tabindex="-1"

                                    role="dialog">

                                   <div class="modal-dialog" role="document">

                                       <div class="modal-content justify-content-center">

                                           <div class="modal-header">

                                               <h5 class="modal-title">Modal title</h5>

                                               <button type="button" class="close" data-dismiss="modal"

                                                       aria-label="Close">

                                                   <span aria-hidden="true">&times;</span>

                                               </button>

                                           </div>

                                           <form action="#">

                                               <div class="modal-body">

                                                   <div class="container">

                                                       <div class="row justify-content-center">

                                                           <div class="col-5 text-center">

                                                               <span>ID</span>

                                                               <input class="form-control" type="text" id="form_edit_id#${content[key].id}"

                                                                      th:name="id"

                                                                      th:value="${content[key].id}"

                                                                      readonly>

                                                               <span>Email</span>

                                                               <input class="form-control" type="text" id="form_edit_email#${content[key].id}"

                                                                      th:name="email"

                                                                      th:value="${content[key].email}">

                                                               <span>Login</span>

                                                               <input class="form-control" type="text" id="form_edit_name#${content[key].id}"

                                                                      th:name="name"

                                                                      th:value="${content[key].name}">

                                                               <span>Password</span>

                                                               <input class="form-control" type="text" id="form_edit_password#${content[key].id}"

                                                                      th:name="password"

                                                                      th:value="${content[key].password}">

                                                               <select th:name="role" id="form_edit_role#${content[key].id}" th:value="${content[key].role}">

                                                                   <option>ROLE_USER</option>

                                                                   <option>ROLE_ADMIN</option>

                                                               </select>

                                                           </div>

                                                       </div>

                                                   </div>

                                               </div>

                                               <div class="modal-footer">

                                                   <button type="button" class="btn btn-secondary"

                                                           data-dismiss="modal">Закрыть

                                                   </button>

                                                   <button onclick="edit_user(${content[key].id})" type="submit" class="btn btn-primary">Edit

                                                       user

                                                   </button>

                                               </div>

                                           </form>

                                       </div>

                                   </div>

                               </div>

                                        <!-- //Modal -->

           </td>

           <td>

                                       <button type="button" onclick="delete_user(${content[key].id})" class="btn btn-info btn-sm" data-toggle="modal"

                                               th:attr="data-target='#userId-' + ${content[key].id}"">${content[key].id}</button>

           </td>

                                       `

          ;

           list.append(tr);

       }


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: