Cakephp 如何将单选按钮水平排列而不是垂直排列?
我一直在寻找一种单选按钮水平排列而不是垂直排列的方法。我一直在查看Cakephp 如何将单选按钮水平排列而不是垂直排列?,cakephp,radio-button,Cakephp,Radio Button,我一直在寻找一种单选按钮水平排列而不是垂直排列的方法。我一直在查看'div'=>'class_name'$options以及$options['between']、$options['separator']和$options['after']但都没有成功。有没有一种“蛋糕式”的方法 <?=$form->input('Product Type', array( 'type' => 'radio', 'id' => $tire['ProductType']
'div'=>'class_name'$options
以及$options['between']
、$options['separator']
和$options['after']
但都没有成功。有没有一种“蛋糕式”的方法
<?=$form->input('Product Type', array(
'type' => 'radio',
'id' => $tire['ProductType']['id'],
'name' => $tire['ProductType']['id'],
'options' => array(2=>'Tire Manufacturer', 7=>'Rim Manufacturer '),
));?>
与此等价的
<label>Product Type</label>
<div style="padding-top:5px;">
<input type="radio" name="data[Manufacturer][product_type_id]" value="<?=$tire['ProductType']['id']?>"> Tire Manufacturer
<input type="radio" name="data[Manufacturer][product_type_id]" value="<?=$wheel['ProductType']['id']?>"> Rim Manufacturer
</div>
产品类型
最简单的方法是将每个单选按钮放在一个'LI'标记内,然后将CSS样式应用到'UL'上,告诉它水平而不是垂直显示'LI'标记。你可以找到很多水平列表设计。这对我来说很有用:
在视图文件(viewfile.ctp)中:
我一直在与之抗争,因为输入[type=radio](在app/webroot/css/cake.generic.css文件中)的默认CakePHP风格规则始终优先。我生成了另一个规则,通过引用表单以及附加类名的radio输入规则(form#changeRegionStdForm input[type=radio].locRad),专门挑选出有问题的无线电组。我最初是用输入[type=”之前列出的表单#规则来完成的。只有当我在输入[type=之后移动它时,单选按钮才水平排列
我希望这是有意义的,并能帮助其他人。我很晚才找到这篇文章。但我想其他人可能会像我现在这样偶然发现这篇文章
试着这样做:
<ul id="hMenu"><li>
<?php
$attributes=array('legend'=>false, 'separator'=>'</li><li>', 'label'=>false);
$form->input('Product Type',$options, $attributes);
?>
</li></ul>
现在给我的身份证做个样式。这应该可以解决这个问题
这个没有任何样式的按钮提供了真正的单选按钮。但是如果你在ul和li上使用css样式,你可以让它竖立起来!:)使用这个:
$form->input('Product Type', array(
'type' => 'radio',
'id' => $tire['ProductType']['id'],
'name' => $tire['ProductType']['id'],
'options' => array(2=>'Tire Manufacturer', 7=>'Rim Manufacturer '),
***********************
'seperator' => '<br />'
***********************
));
$form->input('Product Type',数组(
'类型'=>'无线电',
'id'=>$tire['ProductType']['id'],
'name'=>$tire['ProductType']['id'],
“选项”=>数组(2=>“轮胎制造商”,7=>“轮辋制造商”),
***********************
“分隔符”=>“
”
***********************
));
哪个结果是这样的:
<label>Product Type</label>
<div style="padding-top:5px;">
<input type="radio" name="data[Manufacturer][product_type_id]" value="<?=$tire['ProductType']['id']?>"> Tire Manufacturer
<br />
<input type="radio" name="data[Manufacturer][product_type_id]" value="<?=$wheel['ProductType']['id']?>"> Rim Manufacturer
</div>
产品类型
你可以这样做:
<ul>
<li style="width: 200px;float: left;list-style: none">
<?php
$attributes=array(
'legend'=>false,
'after'=>'</li>',
'separator'=>'</li><li style="width: 200px;float: left;list-style: none">',
);
echo $this->Form->radio('xyz_name',$myOptions,$attributes);
?>
</li>
</ul>
-
试试这个,我让我的代码通过这个
<ul id = "navlist">
<fieldset>
<legend><?php echo __('Insert User'); ?></legend>
<li><?php //echo $this->Form->input('Site', array('options' => $arraycharges));?></li>
<li><?php echo $this->Form->input('MobileApp', array('options' => array('admin' => 'Admin', 'user' => 'User')));?></li>
<li><?php echo $this->Form->input('Location', array('options' => array('admin' => 'Admin', 'user' => 'User')));?></li>
<li><?php echo $this->Form->end(__('GO')); ?></li>
</fieldset>
</ul>
谢谢你的回答,迈克。我还没有找到一个“蛋糕”的方法,所以我只选择了一个复选框。这是因为设计风格行为的责任不是蛋糕,但是分隔符的CSSSpelling将是“分隔符”而不是“分隔符”CakePHP 3更新:分隔符、中间和图例选项已从radio()中删除。您现在可以使用模板更改包装HTML。
<ul>
<li style="width: 200px;float: left;list-style: none">
<?php
$attributes=array(
'legend'=>false,
'after'=>'</li>',
'separator'=>'</li><li style="width: 200px;float: left;list-style: none">',
);
echo $this->Form->radio('xyz_name',$myOptions,$attributes);
?>
</li>
</ul>
<ul id = "navlist">
<fieldset>
<legend><?php echo __('Insert User'); ?></legend>
<li><?php //echo $this->Form->input('Site', array('options' => $arraycharges));?></li>
<li><?php echo $this->Form->input('MobileApp', array('options' => array('admin' => 'Admin', 'user' => 'User')));?></li>
<li><?php echo $this->Form->input('Location', array('options' => array('admin' => 'Admin', 'user' => 'User')));?></li>
<li><?php echo $this->Form->end(__('GO')); ?></li>
</fieldset>
</ul>
#navlist li {
display: inline-block;
list-style-type: none;
padding-right: 20px;
}