执行此代码我得到一个类别列表。它显示如下
我的代码如下所示:
<tr>
<td align="right">
<legend><?php _e( 'Category', self::nspace ); ?></legend>
</td>
<td>
<div class="radio-group">
<?php foreach ( $this->get_media_categories() as $slug => $name ): ?>
<label>
<tr>
<td>
<input type="checkbox" name="media-categories[]" value="<?php echo $slug; ?>"<?php if ( in_array( $slug, $_REQUEST['media-categories'] ) ): ?> checked<?php endif; ?>>
<?php echo $name; ?>
</td>
</tr>
</label>
<?php endforeach; ?>
</div>
</td>
</tr>
我希望它显示在两列中:
category X category X
category X category X
category X category X
category X category X
category X category X
我的问题是我应该如何打破每个循环使其看起来像那样?
编辑: 这是完整的代码:
<form id="mediacat-library-search-form" action="<?php echo get_site_url(); ?>/<?php if ( get_option( 'permalink_structure' ) ): ?><?php echo $this->settings_data['rewrite_url']; ?><?php else: ?>?page_id=11735<?php endif; ?>" method="post">
<table class="table table-bordered" style="text-align: right;" >
<div class="cols two-cols table-responsive table-bordered">
<tr>
<td align="right">
<legend><?php _e( 'Category', self::nspace ); ?></legend>
</td>
<td>
<div class="radio-group">
<?php foreach ( $this->get_media_categories() as $slug => $name ): ?>
<label>
<tr>
<td>
<input type="checkbox" name="media-categories[]" value="<?php echo $slug; ?>"<?php if ( in_array( $slug, $_REQUEST['media-categories'] ) ): ?> checked<?php endif; ?>>
<?php echo $name; ?>
</td>
</tr>
</label>
<?php endforeach; ?>
</div>
</td>
</tr>
<tr>
<td align="right">
<legend><?php _e( 'Keyword', self::nspace ); ?></legend>
</td>
<td>
<p class="form-row" id="mediacat-library-keyword">
<input type="text" name="keyword" id="keyword" value="<?php if ( isset( $_REQUEST['keyword'] ) ) echo $_REQUEST['keyword']; ?>">
</p>
</td>
</tr>
<tr>
<td>
<td align="center" >
<input type="hidden" name="mediacat_library_submit" value="1">
<input type="submit" style=" border: 2px solid #006a4e; background: #ffffff; text-shadow: #ffffff 0 1px 0; padding: 9px 18px; color: #006a4e; font-size: 14px; font-family: helvetica, serif; text-decoration: none; vertical-align: middle; cursor: pointer;" value="<?php _e( 'Search', self::nspace ); ?>">
</td>
<td> </td>
</tr>
</table>
</form>
<?php if ( isset( $_REQUEST['keyword'] ) || isset( $_REQUEST['media-categories'] ) ) $this->mediacat_library( true ); ?>
答案 0 :(得分:2)
您只需使用CSS column-count
:
.radio-group {
column-count: 2;
}
答案 1 :(得分:1)
您需要使用计数器来跟踪和分解列。请查看以下代码。
<tr>
<td align="right">
<legend><?php _e( 'Category', self::nspace ); ?></legend>
</td>
<td>
<div class="radio-group">
<?php
$count = 0;
foreach ( $this->get_media_categories() as $slug => $name ): ?>
<?php if(($count%2) == 0) : ?>
<label>
<tr>
<?php endif; ?>
<td>
<input type="checkbox" name="media-categories[]" value="<?php echo $slug; ?>"<?php if ( in_array( $slug, $_REQUEST['media-categories'] ) ): ?> checked<?php endif; ?>>
<?php echo $name; ?>
</td>
<?php if(($count%2) == 0) : ?>
</tr>
</label>
<?php endif; ?>
<?php $count++; ?>
<?php endforeach; ?>
</div>
</td>
</tr>
答案 2 :(得分:0)
您正在为每列使用行。您需要在每2 tr
次td
后使用正确的table
结构关闭tr
。目前,您正在td
内打印<div class="radio-group">
<table>
<tr>
<?php
$i = 0;
foreach ( $this->get_media_categories() as $slug => $name ):
?>
<td>
<input type="checkbox" name="media-categories[]" value="<?php echo $slug; ?>"<?php if ( in_array( $slug, $_REQUEST['media-categories'] ) ): ?> checked<?php endif; ?>>
<?php echo $name; ?>
</td>
<?php
$i++;
if($i%2 == 0) {
echo "</tr><tr>";
}
endforeach;
?>
</tr>
</table>
</div>
。试试 -
<ul>
<?php foreach ( $this->get_media_categories() as $slug => $name ): ?>
<li>
<label>
<input type="checkbox" name="media-categories[]" value="<?php echo $slug; ?>"<?php if ( in_array( $slug, $_REQUEST['media-categories'] ) ): ?> checked<?php endif; ?>>
<?php echo $name; ?>
</label>
</li>
<?php endforeach; ?>
</ul>
另一个解决方案是 -
li {
list-style: none;
width: 50%;
display: inline-block;
/*rest of the styles*/
}
CSS 将是 -
<div class="md-dialog-main">
<table class="me-hours-table">
<thead>
<th>Product Type</th>
<th>Product Name</th>
<th>
<select>
<option style="background-color:'#FF0000'">weight</option>
<option style="background-color:'#FF0000'">size</option>
</select>
</th>
<th>Price</th>
<th>Qty</th>
</thead>
<tbody>
<tr ng-repeat="data in variants">
<td>{{data.type}}</td>
<td>{{data.name}}</td>
<td>{{data.size}}</td>
<td>{{data.price}}</td>
<td>{{data.qty}}</td>
</tr>
</tbody>
</table>
</div>
答案 3 :(得分:0)
您可以尝试以下内容:
我没有测试过这段代码,但我认为它会起作用。这是一个简单的计数器组合。
<?php
$tdCount = 0;
$tabletd = '';
foreach ( $this->get_media_categories() as $slug => $name ): ?>
<label>
<?php if($tdCount == 2) { ?>
<tr>
<?php echo $tabletd;?>
</tr>
<?php
$tdCount = 0;
$tabletd = '';
}
$tdCount++;
$checked = '';
if ( in_array( $slug, $_REQUEST['media-categories'] ) ){ $checked = 'checked';}
$tabletd.= '<td>
<input type="checkbox" name="media-categories[]" value="'.$slug.'" '.$checked.'>
'.$name.'
</td>';
?>
</label>
<?php endforeach; ?>
<?php if($tabletd!= '') {?>
<label>
<tr>
<?php echo $tabletd;?>
</tr>
</label>
<?php } ?>