如何修复模式引导程序不显示数据?

时间:2019-12-09 08:49:57

标签: php html codeigniter bootstrap-4

“我的模态”未显示或无法从另一个页面模态获取数据。

我想在每个详细信息订单页面中调用数据。单击时仅显示数据。

示例:我想单击发票0098,而单击发票0098数据,而不是显示所有数据。

因为,当我将模态与一页/同一页与视图页一起使用时。当我在每个发票按钮中单击详细信息按钮时,模态数据将显示所有数据。

我将codeigniterbootstrap 4一起使用。

这是我的查看页面:

<!-- start div content -->
  <div class="container" style="padding-top: 30px;">

      <!-- Content Row -->
    <div class="row" >
      <div class="col-lg-12" style="font-size: 14px">    
        <h1>List Order</h1>
    <table class="table" width="900" border="0" cellspacing="1" cellpadding="1">
     <tr>
       <td width="250" align="center"><strong>Invoice</strong></td>
       <td width="200" align="center"><strong>Date Order</strong></td>
       <td width="160" align="center"><strong>Price</strong></td>
       <td width="250" align="center"><strong>Status</strong></td>
     </tr>
      <?php
        //$no = 1;
        $no = $this->uri->segment(3) + 1;
        foreach($ordering as $row)
        {
      ?>
     <tr>
    <td align="center" valign="middle"><?php echo $row->invoice ?></td>
    <td align="center" valign="middle"> <?php echo poland_date($row->btn) ?></td>
    <td align="center" valign="middle">$<?php echo number_format($row->cart_total,2,',','.'); ?></td>
    <td align="center" valign="middle"><a href="orderPage.php?invoice=<?php echo $row->invoice ?>" class="btn btn-info btn-sm" data-toggle="modal" data-target="#orderDetail">Detail</a>
 </td>

  </tr>
    <?php
            $no++;
        }
    ?>
</table>

    <div class="col-lg-12" align="center">
      <?php echo $this->pagination->create_links(); ?>
    </div>

    </div>
  </div>
</div>

<!-- The Modal -->
<div class="modal fade" id="orderDetail" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">

      <!-- Modal Header -->
      <div class="modal-header">
      </div>

      <!-- Modal body -->
      <div class="modal-body">  
      </div>

      <!-- Modal footer -->
      <div class="modal-footer">
      </div>
    </div>
  </div>
</div>
<!-- end div content -->
   <!-- Footer -->
     <?php 
        include 'tmp/footer.php';
  ?> 

     <!-- Bootstrap core JavaScript -->
    <script src="<?php echo base_url();?>assets/jquery/jquery.min.js"></script>
    <script src="<?php echo base_url();?>assets/bootstrap/js/bootstrap.bundle.min.js"></script>  
    <script language="javascript">
    $('body').on('hidden.bs.modal', '.modal', function () {
        $(this).removeData('bs.modal');
    });
  </script>
  </body>

</html>

这是呼叫模态数据(orderPage.php):

 <div class="modal-header">
    <<h3 class="modal-title">Detail Order <?php echo $row->invoice ?></h3>
    <button type="button" class="close" data-dismiss="modal">&times;</button>
  </div>

  <!-- Modal body -->
  <div class="modal-body">
    <?php
    foreach($ordering as $row)
    {
    ?>
    <table class="table table-striped">
      <thead>
      <tr>
        <th>Date</th>
        <th>Product</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td> <?php echo $row->date;?></td>
        <td> <?php echo $row->product;?></td>
      </tr>

      </tbody>
    </table>
     <?php
        }
     ?>
    <br />
    <div align="center">
    <strong>Status :
    <?php 

        echo $row->status;  
    ?>
    </strong>
    </div>
    <br />
    <br />

  </div>

  <!-- Modal footer -->
  <div class="modal-footer">
    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
  </div>

当我详细单击时,模式显示但没有得到任何数据,只是空白页。

1 个答案:

答案 0 :(得分:1)

您可以在视图页面中插入模式脚本。

是的,所以您只使用一页。没有调用另一个页面来查看模式数据。

<h1>List Order</h1>
    <table class="table" width="900" border="0" cellspacing="1" cellpadding="1">
     <tr>
       <td width="250" align="center"><strong>Invoice</strong></td>
       <td width="200" align="center"><strong>Date Order</strong></td>
       <td width="160" align="center"><strong>Price</strong></td>
       <td width="250" align="center"><strong>Status</strong></td>
     </tr>
      <?php
        $no = $this->uri->segment(3) + 1;
        foreach($ordering as $row)
        {
      ?>
     <tr>
    <td align="center" valign="middle"><?php echo $row->invoice ?></td>
    <td align="center" valign="middle"> <?php echo poland_date($row->btn) ?></td>
    <td align="center" valign="middle">$<?php echo number_format($row->cart_total,2,',','.'); ?></td>
    <td align="center" valign="middle"><a href="#<?php echo $row->invoice; ?>" data-reveal-id="<?php echo $row->invoice?>" class="btn btn-info btn-sm" data-toggle="modal">Detail</a>
 </td>

  </tr>
    <?php
            $no++;
        }
    ?>
</table>

<?php
        $no = $this->uri->segment(3) + 1;
        foreach($ordering as $row)
        {
?>
<div class="modal fade" id="<?php echo $row->invoice; ?>" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
    <<h3 class="modal-title">Detail Order <?php echo $row->invoice ?></h3>
    <button type="button" class="close" data-dismiss="modal">&times;</button>
  </div>

  <!-- Modal body -->
  <div class="modal-body">
    <table class="table table-striped">
      <thead>
      <tr>
        <th>Date</th>
        <th>Product</th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td> <?php echo $row->date;?></td>
        <td> <?php echo $row->product;?></td>
      </tr>
      </tbody>
    </table>
    <br />
    <div align="center">
    <strong>Status :
    <?php 
        echo $row->status;  
    ?>
    </strong>
    </div>
    <br />
    <br />

  </div>

  <!-- Modal footer -->
  <div class="modal-footer">
    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
  </div>
</div>
</div>
</div>
<?php
        $no++;
    }
?>

为什么我输入脚本再次调用查询数据库,因为在第一个查询中它只是为了查看页面。并且当您添加模式引导程序并在视图页面中将查询与查询一起加入时,模式数据显示的所有数据与视图页面相同。而且我刚刚再次创建了与第一个查询相同的查询,并且模式引导程序调用数据并显示数据,就像我们单击详细数据一样。