Мой модал отображается, но в отображаемом модале нет содержимого - PullRequest
0 голосов
/ 18 февраля 2020

Я хочу включить простой bootstrap модал. Код минимален, но, похоже, что-то не так. Когда я нажимаю кнопку просмотра, отображается модал, но в нем нет данных. Это мой индекс. php:

<?php  
    $connect = mysqli_connect("localhost", "root", "", "baps");  
    $query = "SELECT * FROM tab_organizers";  
    $result = mysqli_query($connect, $query);  
?>  
<!DOCTYPE html>  
    <html>  
        <head>  
            <title>Webslesson Tutorial | Bootstrap Modal with Dynamic MySQL Data using Ajax & 
             PHP</title>  
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
            <link rel="stylesheet" 
            href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />  
            <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"> 
            </script>  
        </head>  
        <body>  
            <br /><br />  
            <div class="container" style="width:700px;">  
                <h3 align="center">Visitor's List</h3>  
                <br />  
                <div class="table-responsive">  
                    <table class="table table-bordered">  
                        <tr>  
                            <th width="70%">Group Name</th>  
                            <th width="30%">View</th>  
                        </tr>  
                        <?php  
                        while($row = mysqli_fetch_array($result))  
                        {  
                        ?>  
                        <tr>  
                            <td><?php echo $row["GroupName"]; ?></td>  
                            <td><input type="button" name="view" value="view" id="<?php echo 
                                 $row["id"]; ?>" class="btn btn-info btn-xs view_data" /></td>  
                        </tr>  
                        <?php  
                        }  
                        ?>  
                 </table>  
              </div>  
           </div>  
        </body>  
    </html>  
    <div id="dataModal" class="modal fade">  
        <div class="modal-dialog">  
            <div class="modal-content">  
                <div class="modal-header">  
                    <button type="button" class="close" data-dismiss="modal">&times;</button>  
                    <h4 class="modal-title">Visitor Details</h4>  
                </div>  
                <div class="modal-body" id="visitor_detail">  
                </div>  
                <div class="modal-footer">  
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
                </div>  
            </div>  
        </div>  
    </div>  
    <script>  
        $(document).ready(function(){  
            $('.view_data').click(function(){  
                var OrganizerID = $(this).attr("id");  
                    $.ajax({  
                        url:"select.php",  
                        method:"post",  
                        data:{OrganizerID:OrganizerID},  
                        success:function(data){  
                        $('#visitor_detail').html(data);  
                        $('#dataModal').modal("show");  
                    }  
                });  
            });  
        });  
    </script>

Это мой выбор. php:

<?php  
    if(isset($_POST["OrganizerID"]))  
    {  
        $output = '';  
        $connect = mysqli_connect("localhost", "root", "", "baps");  
        $query = "SELECT * FROM tab_organizers WHERE OrganizerID = '".$_POST["OrganizerID"]."'";  
        $result = mysqli_query($connect, $query); 
        $output .= '  
            <div class="table-responsive">  
            <table class="table table-bordered">';  
        while($row = mysqli_fetch_array($result))  
        {  
            $output .='
                <tr>
                    <td><label>Record Entered on: </label></td>
                    <td>'.$row["Datetimestamp"].'</td>
                </tr>
                <tr>
                    <td><label>Organizer ID: </label></td>
                    <td>'.$row["OrganizerID"].'</td>
                </tr>
                <tr>
                    <td><label>Group Name</label></td>
                    <td>'.$row["GroupName"].'</td>
                </tr>
                <tr>
                    <td><label>Contact Name</label></td>
                    <td>'.$row["ContactName"].'</td>
                </tr>
                <tr>
                    <td><label>House or Apartment #: </label></td>
                    <td>'.$row["Address1"].'</td>
                </tr>
                <tr>
                    <td><label>Street Name: </label></td>
                    <td>'.$row["Address2"].'</td>
                </tr>
                <tr>
                    <td><label>City: </label></td>
                    <td>'.$row["City"].'</td>
                </tr>
                <tr>
                    <td><label>Province: </label></td>
                    <td>'.$row["Province"].'</td>
                </tr>
                <tr>
                    <td><label>Postal Code: </label></td>
                    <td>'.$row["PostalCode"].'</td>
                </tr>
                <tr>
                    <td><label>Country: </label></td>
                    <td>'.$row["Country"].'</td>
                </tr>
                <tr>
                    <td><label>Title or Profession: </label></td>
                    <td>'.$row["Title"].'</td>
                </tr>
                <tr>
                   <td><label>Home or Office #: </label></td>
                   <td>'.$row["Telephone1"].'</td>
                </tr>
                <tr>
                    <td><label>Cell Number: </label></td>
                    <td>'.$row["Telephone2"].'</td>
                </tr>
                <tr>
                    <td><label>Fax Number: </label></td>
                    <td>'.$row["FaxNumber"].'</td>
                </tr>
                <tr>
                    <td><label>School Email Address: </label></td>
                    <td>'.$row["SchoolGeneralEmail"].'</td>
                </tr>
                <tr>
                    <td><label>Personal Email Address: </label></td>
                    <td>'.$row["Email"].'</td>
                </tr>
                <tr>
                    <td><label>How did you hear about us: </label></td>
                    <td>'.$row["HowDidYouHear"].'</td>
                </tr>
                <tr>
                    <td><label>Santo`s or Karyakar`s Comments on this Organizer</label></td>
                    <td>'.$row["Comments"].'</td>
                </tr>
                <tr>
                    <td><label>Diwali Invites to be send?</label></td>
                    <td>'.$row["Diwaliinvites"].'</td>
                </tr>
                <tr>
                    <td><label>Subscribe to BAPS mailing list?</label></td>
                    <td>'.$row["SubscribedToMailingList"].'</td>
                </tr>
            '; 
        }
        $output .= "</table></div>";  
        echo $output;
    }
?>

имена столбцов моей базы данных следующие: OrganizerID (int (11)) GroupName (varchar (240)) ContactName (varchar (50)) Address1 (varchar (50)) Address2 (varchar (50)) Город (varchar (50)) Провинция (varchar (50)) Почтовый индекс (varchar ( 50)) Страна (varchar (50)) Должность (varchar (50)) Телефон1 (varchar (50)) Телефон2 (varchar (50)) FaxNumber (varchar (50)) SchoolGeneralEmail (varchar (50)) Электронная почта (varchar (100) )) SubscribeedToMailingList (бит (1)) HowDidYouHear (varchar (50)) Комментарии (средний текст) Метка даты и времени (datetime) Diwaliinvites (бит (1))

...