我'我将值存储在一个数组中,然后循环遍历它并创建动态HTML td和tr depedning条件。当循环增量值为6和11时,表tr应该断开到下一个tr。
我'我不确定我是什么'我在这里失踪了。一切看起来都不错。这是screenshots
PHP代码
<table class="table table-condensed" id="tblareaXP">
<thead>
<tr>
<th colspan="5">Areas of Expertise</th>
</tr>
</thead>
<tbody>
<?php
$i = 0;
$array = array(
"Program Management" => "Program Management",
"Finance Administration" => "Finance Administration",
"Training Facilitation" => "Training Facilitation",
"Operations Logistics" => "Operations Logistics",
"Communications Media" => "Communications Media",
"Monitoring Evaluation" => "Monitoring Evaluation",
"Board Goveranance" => "Board Goveranance",
"Research Learning" => "Research Learning",
"Strategic Planning" => "Strategic Planning",
"Program Design" => "Program Design",
"Other Area" => "Other Area"
);
foreach( $array as $key => $item ){
$i++;
?>
<?php if( $i == 6 or $i == 11 ){ ?><tr><?php } ?>
<td><input type="checkbox" name="prodevxp" value="<?php echo $key; ?>"><label for=""> <?php echo $item; ?></label></td>
<?php if( $i == 6 or $i == 11 ){ ?></tr><?php } ?>
<?php } ?>
</tbody>
</table>
答案 0 :(得分:0)
您的代码生成如下所示的HTML:
<tbody>
<td><input type="checkbox" name="prodevxp" value="Program Management"><label for=""> Program Management</label></td>
<td><input type="checkbox" name="prodevxp" value="Finance Administration"><label for=""> Finance Administration</label></td>
<td><input type="checkbox" name="prodevxp" value="Training Facilitation"><label for=""> Training Facilitation</label></td>
<td><input type="checkbox" name="prodevxp" value="Operations Logistics"><label for=""> Operations Logistics</label></td>
<td><input type="checkbox" name="prodevxp" value="Communications Media"><label for=""> Communications Media</label></td>
<tr>
<td><input type="checkbox" name="prodevxp" value="Monitoring Evaluation"><label for=""> Monitoring Evaluation</label></td>
</tr>
<td><input type="checkbox" name="prodevxp" value="Board Goveranance"><label for=""> Board Goveranance</label></td>
<td><input type="checkbox" name="prodevxp" value="Research Learning"><label for=""> Research Learning</label></td>
<td><input type="checkbox" name="prodevxp" value="Strategic Planning"><label for=""> Strategic Planning</label></td>
<td><input type="checkbox" name="prodevxp" value="Program Design"><label for=""> Program Design</label></td>
<tr>
<td><input type="checkbox" name="prodevxp" value="Other Area"><label for=""> Other Area</label></td>
</tr>
</tbody>
查看<tr>
中包含的行如何最终在自己的行中?你真正想要产生的是这样的:
<tbody>
<tr>
<td><input type="checkbox" name="prodevxp" value="Program Management"><label for=""> Program Management</label></td>
<td><input type="checkbox" name="prodevxp" value="Finance Administration"><label for=""> Finance Administration</label></td>
<td><input type="checkbox" name="prodevxp" value="Training Facilitation"><label for=""> Training Facilitation</label></td>
<td><input type="checkbox" name="prodevxp" value="Operations Logistics"><label for=""> Operations Logistics</label></td>
<td><input type="checkbox" name="prodevxp" value="Communications Media"><label for=""> Communications Media</label></td>
<td><input type="checkbox" name="prodevxp" value="Monitoring Evaluation"><label for=""> Monitoring Evaluation</label></td>
</tr>
<tr>
<td><input type="checkbox" name="prodevxp" value="Board Goveranance"><label for=""> Board Goveranance</label></td>
<td><input type="checkbox" name="prodevxp" value="Research Learning"><label for=""> Research Learning</label></td>
<td><input type="checkbox" name="prodevxp" value="Strategic Planning"><label for=""> Strategic Planning</label></td>
<td><input type="checkbox" name="prodevxp" value="Program Design"><label for=""> Program Design</label></td>
<td><input type="checkbox" name="prodevxp" value="Other Area"><label for=""> Other Area</label></td>
</tr>
</tbody>
然后每行包裹在<tr>
中。你怎么做的呢?好吧,首先尝试将所有项目放在一行中:
<tbody>
<tr>
<?php foreach($array as $key => $item): ?>
<td><input type="checkbox" name="prodevxp" value="<?php echo $key; ?>"><label for=""> <?php echo $item; ?></label></td>
<?php endforeach; ?>
</tr>
</tbody>
这是一个好的开始!您现在需要做的就是让它结束最后一行并每5列开始一个新行。幸运的是,这很容易:
<tbody>
<tr>
<?php
$i = 0;
foreach($array as $key => $item) {
if($i > 0 && $i % 5 === 0) {
echo '</tr><tr>';
}
$i++;
?>
<td><input type="checkbox" name="prodevxp" value="<?php echo $key; ?>"><label for=""> <?php echo $item; ?></label></td>
<?php
}
?>
</tr>
</tbody>
的Presto!但是,我还是要叫你出去使用桌子。这不是表格数据。这是布局。骗子!所以让我们试着弄清楚如何以不同的方式做到这一点。看起来你正在使用Bootstrap。 我想知道它是否有任何帮助... aha!
通过the documentation简要略读,你应该可以很容易地设置一个网格。首先,而不是table
/ tbody
,将整个内容包装在container-fluid
中。然后,而不是td
s,将每个项目包装在col-md-2
或其他内容中。 (实际上,似乎Bootstrap中没有五列的规定,但是another question on Stack Overflow for that。)结果:
<div class="container-fluid">
<?php foreach($array as $key => $item): ?>
<div class="col-md-2"><input type="checkbox" name="prodevxp" value="<?php echo $key; ?>"><label for=""> <?php echo $item; ?></label></div>
<?php endforeach; ?>
</div>
此解决方案