将foreach表加载到从另一个foreach表调用的模态中

Question

i have a modal with a table in in. i load the modal from a foreach table. i believe my code is right but i dont know why it displays in a funny way. this is my code and when i run this code this is the result i get. click on the link to view the image image

 <tbody>
           <?php
                        $count = 1; 
                        $notarray = DataDB::getInstance()->select_from_where('order_collective','user_id',$userid);
                        foreach($notarray as $row):
                        $address = $row['appartment'].",".$row['address'].",".$row['city'].",".$row['state'].".".$row['landmark'];
                        ?>
                    <tr>
                        <td><?php echo $count++;?></td>
                        <td><?php echo $row['trackingnumber'];?></td>
                        <td><?php echo "NGN ".number_format($row['price'], 2);?></td>
                        <td><?php echo $address;?></td>
                        <td><?php echo $row['order_date'];?></td>
                        <td><?php echo DataDB::getInstance()->get_name_from_id('name','delivery_status','delivery_status_id',$row['delivery_status']);?></td>

              <td>
                <div class="btn-group">
                     <button type="button" class="btn btn-info" data-toggle="modal" data-target="#myVie<?php echo $row['trackingnumber'] ?>">View</button>

                </div>
              </td>
            </tr>
             <?php include ('order_history_modal.php'); ?>
            <?php endforeach;?>
            </tbody>
 <!-- ORDER HISTORY Modal content-->
  <div id="myVie<?php echo $row['trackingnumber'] ?>" class="modal fade" role="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">

           <div class="table-responsive">
                      <table class="table">
<thead>
  <tr>
    <th>Item</th>
    <th>Quantity</th>
    <th>Price</th>
  </tr>
</thead>
<tbody>
<?php 
        $notal = DataDB::getInstance()->select_from_where('order_details','trackingnumber',$row['trackingnumber']);             
        foreach($notal as $rol):
        $prrname = DataDB::getInstance()->get_name_from_id('product_name','product','product_id',$rol['product_id']);?>
  <tr>
    <td><?php echo $prrname ?></td>
    <td><?php echo $rol['quantity'] ?></td>
    <td><?php echo "NGN ".number_format($rol['price'], 2);?></td>
  </tr>
 <?php endforeach; ?>
</tbody>
 </table>
                        <p></p>
                      </div> 
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
  </div>
</div>

</div>
</div>

</div>
</div>

Answer 1

Use like this.

<table class="table">
    <thead>
        <tr>
            <th>#</th>
            <th>Track Number</th>
            <th>Price</th>
            <th>Address</th>
            <th>Order Date</th>
            <th>Status</th>
            <th>Auction</th>
        </tr>
    </thead>


    <tbody>
    <?php
        $count = 1; 
        $notarray = DataDB::getInstance()->select_from_where('order_collective','user_id',$userid);
        foreach($notarray as $row):
        $address = $row['appartment'].",".$row['address'].",".$row['city'].",".$row['state'].".".$row['landmark'];
        ?>
    <tr>
        <td><?php echo $count++;?></td>
        <td><?php echo $row['trackingnumber'];?></td>
        <td><?php echo "NGN ".number_format($row['price'], 2);?></td>
        <td><?php echo $address;?></td>
        <td><?php echo $row['order_date'];?></td>
        <td><?php echo DataDB::getInstance()->get_name_from_id('name','delivery_status','delivery_status_id',$row['delivery_status']);?></td>
        <td>
        <div class="btn-group">
            <button type="button" class="btn btn-info" data-toggle="modal" data-target="#myVie<?php echo $row['trackingnumber'] ?>">View</button>
        </div>
        <?php include ('order_history_modal.php'); ?>
        </td>
    </tr>  
    <?php endforeach;?>
</tbody>
</table>

order_history_modal.php

<div id="myVie<?php echo $row['trackingnumber'] ?>" class="modal fade" role="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">
            <div class="table-responsive">
                <table class="table">
                    <thead>
                      <tr>
                        <th>Item</th>
                        <th>Quantity</th>
                        <th>Price</th>
                      </tr>
                    </thead>
                    <tbody>
                <?php 
                $notal = DataDB::getInstance()->select_from_where('order_details','trackingnumber',$row['trackingnumber']);             
                foreach($notal as $rol):
                    $prrname = DataDB::getInstance()->get_name_from_id('product_name','product','product_id',$rol['product_id']);?>
                    <tr>
                    <td><?php echo $prrname ?></td>
                    <td><?php echo $rol['quantity'] ?></td>
                    <td><?php echo "NGN ".number_format($rol['price'], 2);?></td>
                    </tr>
                <?php endforeach; ?>
                </tbody>
                </table>
             </div> 
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </div>
    </div>

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <!-- Latest compiled and minified JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <table class="table"> <thead> <tr> <th>#</th> <th>Track Number</th> <th>Price</th> <th>Address</th> <th>Order Date</th> <th>Status</th> <th>Auction</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td> <div class="btn-group"> <button type="button" class="btn btn-info" data-toggle="modal" data-target="#myVie1">View</button> </div> <div id="myVie1" class="modal fade" role="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"> <div class="table-responsive"> <table class="table"> <thead> <tr> <th>Item</th> <th>Quantity</th> <th>Price</th> </tr> </thead> <tbody> <tr> <td>test</td> <td>test</td> <td>test</td> </tr> </tbody> </table> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </td> </tr> </tbody> </table>