как показать данные в базе данных в таблице, используя модальные - PullRequest
Новая
       17

как показать данные в базе данных в таблице, используя модальные

0 голосов
/ 20 июня 2019

Я хочу, чтобы данные в моей таблице были кликабельными и отображались в модальном режиме. затем получите идентификатор этих данных (из таблицы) и покажите остальные данные в базе данных в этом режиме.

Я пытался следовать этому, но это не работает, я не знаю, почему 

            <table class="table table-hover table-bordered results" style="color:white;">
               <thead>
                <tr>
                  <th>Contact #</th>
                  <th>Picture</th>
                  <th >Name / Surname</th>
                  <th >Address</th>
                 </tr>
                <tr class="warning no-result">
                  <td colspan="4"><i class="fa fa-warning"></i> No result</td>
                </tr>
              </thead>
              <tbody>
                  <?php   
                        $sqlb = "select * from debtors  ";
                        $resultb = $conn->query($sqlb);
                        while($rowb = $resultb->fetch_assoc()){
                        $id=$rowb['contact #']; 
                  ?>

                <tr a class="dropdown-item"  data-toggle="modal" data-target="#logoutModal" style="color:white;">
                  <td><?php echo $rowb['contact #']; ?></td>
                  <td><?php echo $rowb['lname']; ?></td>
                  <td><?php echo $rowb['fname']; ?></td>
                  <td><?php echo $rowb['address']; ?></td></a>
                </tr>
              <?php } ?>
              </tbody>
            </table>

          </div>

          <!-- Logout Modal-->
<span>      
      <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="exampleModalLabel"></h5>
              <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">x</span>
              </button>
            </div>
            <div class="modal-body"><?php echo $rowb['lname']; ?>, <?php echo $rowb['fname']; ?><BR>
<?php echo $rowb['balance']; ?>
            </div>
            <div class="modal-footer">
              <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
              <a class="btn btn-info" href="admin_logout.php">Yes</a>
            </div>
          </div>
        </div>
      </div>
</span>

Я хочу, чтобы строка моей таблицы отображала модальное значение при нажатии, а затем отображала данные, относящиеся к выбранной строке из базы данных в этом режиме

Ответы [ 2 ]

0 голосов
/ 22 июня 2019

Вместо этого вы можете использовать try catch для тела вашей таблицы. 

     try {
            $pdo = new PDO('mysql:host=localhost:3306;dbname=databaseName;', 'username', 'password' );
            $pdo->setAttribute( PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION );
            $stmt = $pdo->prepare(
                "SELECT * from debtors  "
            );
            $flag = $stmt->execute();
            if ( !$flag ) {
                $info = $stmt->errorInfo();
                exit( $info[2] );
            }
            while ( $row = $stmt->fetch( PDO::FETCH_ASSOC ) ) {
                $num = $num +1;
                @$tbody .='<tr>';
                    //$tbody .='<td>'.$row["id"].'</td>
                    $tbody .='<td>'.$num.'</td
                        <input type="hidden" id="id'.$row["id"].'" value="'.$row["id"].'"/>
<input type="hidden" id="contact #'.$row["contact #"].'" value="'.$row["id"].'"/>
                        <input type="hidden" id="lname'.$row["id"].'" value="'.$row["lname"].'"/>
                        <input type="hidden" id="fname'.$row["id"].'" value="'.$row["fname"].'"/>
                        <input type="hidden" id="address'.$row["id"].'" value="'.$row["address"].'" />
                    ';

                    $tbody .='<td>'.$row["contact #"].'</td>';
                    $tbody .='<td>'.$row["lname"].'</td>';
                    $tbody .='<td>'.$row["fname"].'</td>';
                    $tbody .='<td>P'.$row["address"].'</td>';

                    $tbody .='<td><input type ="button" id = "btnshow" value = "show"  data-id="'.$row["id"].'"></input></td></a>';     
            }   
        }
        catch ( PDOException $e ) {
        echo $e->getMessage();
        $pdo = null;
    }

просто убедитесь, что данные в базе данных имеют уникальные идентификаторы.для скрипта: 

$(document).on('click','#btnshow',function(){

        var id_show = $(this).data('id');
        var contact= document.getElementById('contact #'+id_edit).value;
        var lname= document.getElementById('lname'+id_edit).value;
        var fname= document.getElementById('fname'+id_edit).value;
        var address= document.getElementById('address'+id_edit).value;

        $(".modal-heading").html('')
        $(".modal-body").html(
            '<div class = "container-fluid" style="width:89%;" >' +
'<input type="hidden" class="form-control" id="id_row" name="id_row" value="'+ id_edit +'"></input>'+ <input type="text" id="contact" name= "contact" readonly="readonly" class="form-control"  value="'+contact #+'"></input>'+ <input type="text" id="lname" name= "lname" readonly="readonly" class="form-control"  value="'+lname+'"></input>'+ <input type="text" id="fname" name= "fname" readonly="readonly" class="form-control"  value="'+fname+'"></input>'+<input type="text" id="address" name= "address" readonly="readonly" class="form-control"  value="'+address+'"></input>'+

'</form></div>'
        )
    })

ваш html: 

<table id ="products">
<col width="130">
<col width="80">
    <thead>
        <th>ID</th>
        <th>CONTACT</th>
        <th>LNAME</th>
        <th>FNAME</th>
        <th>ADDRESS</th>

    </thead>
    <tbody>
        <?php echo $tbody;?>
    </tbody>
</table>
0 голосов
/ 20 июня 2019

Во-первых, модальное не находится в цикле, поэтому вы не можете получить доступ к $rowb в модальном, а во-вторых, это неправильный путь, потому что после помещения модального в цикл это создаст так много (сотни или тысячи)модалы, которые не являются хорошими с точки зрения производительности.

Правильный путь - создать модал, назначить класс кнопке и поместить числовой идентификатор в атрибут id, а при нажатии этой кнопки сделать ajaxпозвоните и получите данные и покажите их в модале.Таким образом, один мод будет динамически показывать вам нужные данные.

...