因此,我创建了这个页面,找到不同的客户并为每个客户加载数据。数据位于可折叠div中,底部数据集悬挂在模态上。这是我写的代码。
echo'<div id="findCustByFirstNameModal" class="modal modal-message modal-success fade" style="display: none;" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content" style="width: 600px;">
<div class="modal-header">
<i class="glyphicon glyphicon-list-alt"></i>
</div>
<div class="modal-title">Success</div>
<div class="modal-body">
<div class="panel-heading">
';
foreach($test as $key => $val)
{
$custNum= $test[$key]["customerNumber"];
if($prevCustNum!=$custNum)
{
echo'
<a class="panel-title collapsed" data-toggle="collapse" data-parent="#panel-'.$test[$key]["customerNumber"].'" href="#panel-element-'.$test[$key]["customerNumber"].'">
<table class="table" style="background-color: light-gray">
<tr>
<td>Customer Number:</td><td>'.$test[$key]["customerNumber"].'</td>
</tr>
<tr>
<td>Name:</td><td>'.$test[$key]["firstName"].' '.$test[$key]["lastName"].'</td>
</tr>
</table>
</a>
</div>
<div id="panel-element-'.$test[$key]['customerNumber'].'" class="panel-collapse collapse">
<div class="panel-body">
<table class="table table-striped">
';
foreach($test as $key => $val)
{
if($test[$key]["customerNumber"] == $custNum)
{
echo'
<tr><td>Ticket Number:</td><td class="fontBlue"><form action="aap.php" method="POST"><input type="submit" id="submitButtonLink" name="ticketNumber" value="'.$test[$key]["ticketNumber"].'"></form></td></tr>
<tr><td>Description:</td><td>'.substr($test[$key]["issueDescription"], 0, 40).'</td></tr>
';
}
}
echo'
</table>
</div>
</div>
<div style="padding:30px;">
</div>
';
}
$prevCustNum= $custNum;
}
echo'
</div> <!-- / .modal-body -->
<div class="modal-footer">
<button type="button" class="btn btn-success" data-dismiss="modal">OK</button>
</div>
</div> <!-- / .modal-content -->
</div> <!-- / .modal-dialog -->
</div>
';
在页面源的此屏幕截图中,您可以看到结束div标签刚好在故障单信息之前的最后一个客户名称下移动。
代码中的所有内容都排成一列,因此我不确定导致此问题的原因。
答案 0 :(得分:1)
您在第一个<div class="panel-heading">
循环之前输出foreach
。然后,您在循环中有</div>
,但尚未打开任何新的<div>
。这意味着循环中的</div>
正在关闭在循环外部创建的<div class="panel-heading">
。这将导致标签不匹配,并可能产生一些非常意外的结果。