Бутстрап модальный на каждом отдельном ряду - PullRequest
0 голосов
/ 28 января 2019

Как правило, страница должна запрашивать пользователя (желательно с модальным) перед подтверждением действия. Я изменил нашу веб-страницу, чтобы она включала модальные значения для удаления для каждой отдельной строки.Кажется, что модальное окно не открывается, если я включаю id = "modalname" как для кнопки-цели данных, так и для модального идентификатора.

<table id="example1" class="table table-bordered table-striped">
                <thead>
                  <tr>
                    <th>Full Name</th>
                    <th>Company</th>
                    <th>Address</th>
                    <th>Email</th>
                    <th>Contact No.</th>
                    <th>Birth Date</th>


                    <th>Action</th>
                  </tr>
                </thead>
                <tbody>
<?php

$con = mysqli_connect("localhost","root","","database");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }
        $query=mysqli_query($con,"select * from client  order by lname")or die(mysqli_error());
        while($row=mysqli_fetch_array($query)){

?>
                      <tr>
                        <td><?php echo $row['lname'];?>,
                       <?php echo $row['fname'];?> <?php echo $row['mname'];?> </td>
                        <td><?php echo $row['company'];?></td>
                         <td><?php echo $row['address'];?></td>
                         <td><?php echo $row['email'];?></td>
                        <td><?php echo $row['contact'];?></td>
                        <td><?php echo $row['bday'];?></td>
                        <td>
                <button type="button" data-toggle="modal" data-target="#deletemodale<?php echo $row['id'];?>" >Open Modal</button>



                        </td>
                      </tr>


                    </tbody>

                  </table>

Вот пример кода для моей таблицы.Он включает в себя отраженные значения из базы данных с кнопкой в ​​каждой строке для модального.

Модальный код:

      <div class="modal fade" id="deletemodale<?php echo $row['id'];?>" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content" >
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>

    </div>
  </div>

Я пробовал это с тэгом и href ранее, кажется, что идентификатор строкибудет отображаться в URL, если я наведусь на него, но модал не откроется в обоих случаях.Модал также, кажется, открывается правильно, если я уберу тег php с его идентификатора.У меня также есть только этот модальный код для остальных строк из-за его динамической природы

Ответы [ 2 ]

0 голосов
/ 28 января 2019

Я взял на себя смелость и добавил закрывающую скобку для вашего цикла while сразу после последнего </tr> (до </tbody> в вашем первом фрагменте кода. Я также скопировал второй фрагмент вашего кода (вы назвали его "Модальным").Код ") прямо перед закрывающей скобкой - так как вы даете разные идентификаторы для модальных, я предполагаю, что каждая строка в вашей таблице имеет свой модальный. И все отлично работает на моем сервере WAMP. Убедитесь, что:

  1. Вы включили jquery.js, bootstrap.css и bootstrap.js
  2. Вы включили JavaScript в своем браузере.
0 голосов
/ 28 января 2019

Из того, что я вижу, ваш код действителен, но я не вижу, где заканчивается ваш цикл while.Если у вас нет модального кода в цикле while, будет напечатан только один модальный html-код, поэтому будет модальный только для последней строки ['id']. Так ли это?Также ваш цикл while должен заканчиваться перед тегом tbody.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...