CakePHP 的 FormHelper 是你在制作 CakePHP 应用程序时生成表单的方式。正如人们可能假设的那样,这包括生成输入元素,如下所示:
$this->Form->input('abc');
这将产生如下所示的 HTML:
<div class="input text">
<label for="ModelAbc">Abc</label>
<input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
</div>
现在,可悲的是,Bootstrap想要如下的东西:
<div class="control-group">
<label for="ModelAbc" class="control-label">Abc</label>
<div class="controls">
<input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
</div>
</div>
如何使 CakePHP 产生此输出?
受到 lericson 的回答的启发,这是我对 CakePHP 2.x 的最终解决方案:
<?php echo $this->Form->create('ModelName', array(
'class' => 'form-horizontal',
'inputDefaults' => array(
'format' => array('before', 'label', 'between', 'input', 'error', 'after'),
'div' => array('class' => 'control-group'),
'label' => array('class' => 'control-label'),
'between' => '<div class="controls">',
'after' => '</div>',
'error' => array('attributes' => array('wrap' => 'span', 'class' => 'help-inline')),
)));?>
<fieldset>
<?php echo $this->Form->input('Fieldname', array(
'label' => array('class' => 'control-label'), // the preset in Form->create() doesn't work for me
)); ?>
</fieldset>
<?php echo $this->Form->end();?>
它产生:
<form...>
<fieldset>
<div class="control-group required error">
<label for="Fieldname" class="control-label">Fieldname</label>
<div class="controls">
<input name="data[Fieldname]" class="form-error" maxlength="255" type="text" value="" id="Fieldname"/>
<span class="help-inline">Error message</span>
</div>
</div>
</fieldset>
</form>
我基本上添加了"格式"和"错误"键,并将控件标签类添加到标签元素中。
这是 Bootstrap 3 的解决方案
<?php echo $this->Form->create('User', array(
'class' => 'form-horizontal',
'role' => 'form',
'inputDefaults' => array(
'format' => array('before', 'label', 'between', 'input', 'error', 'after'),
'div' => array('class' => 'form-group'),
'class' => array('form-control'),
'label' => array('class' => 'col-lg-2 control-label'),
'between' => '<div class="col-lg-3">',
'after' => '</div>',
'error' => array('attributes' => array('wrap' => 'span', 'class' => 'help-inline')),
))); ?>
<fieldset>
<legend><?php echo __('Username and password'); ?></legend>
<?php echo $this->Form->input('username'); ?>
<?php echo $this->Form->input('password'); ?>
</fieldset>
<?php echo $this->Form->end(__('Login')); ?>
如果字段需要自己的标签:
<?php echo $this->Form->input('username', array('label' => array('text' => 'Your username', 'class' => 'col-lg-2 control-label'))); ?>
这是一种方法:
<?php echo $this->Form->create(null, array(
'inputDefaults' => array(
'div' => array('class' => 'control-group'),
'label' => array('class' => 'control-label'),
'between' => '<div class="controls">',
'after' => '</div>',
'class' => '')
)); ?>
您的答案是正确的,但为了其他用户的利益,您可以进行一些其他调整以利用错误/帮助文本:
将form-horizontal
添加到Form->create()
中的class
以获得更紧凑的表单(标签位于输入左侧,而不是顶部(
以下是将帮助文本放在字段下方的方法(必须为每个字段完成(,不要忘记关闭</div>
。
echo $this->Form->input('field_name', array(
'after'=>'<span class="help-block">This text appears
underneath the input.</span></div>'));
并正确显示错误:
// cake 2.0
echo $this->Form->input('abc', array(
'error' => array('attributes' => array('class' => 'controls help-block'))
));
输出:
<div class="control-group required error">
<label for="ModelAbc" class="control-label">Abc</label>
<div class="controls">
<input name="data[Model][Abc]" class="" maxlength="250" type="text" id="ModelAbc">
</div>
<!-- error message -->
<div class="controls help-block">This is the error validation message.</div>
<!-- error message -->
</div>
这是额外的标记,不像引导程序那样整洁,但这是一个快速修复。另一种方法是单独执行每个错误消息。
而且它排列得很好。但是,我还没有发现一种使用inline
消息的简单方法。
将上述相同的原理应用于form->end函数,如下所示:
<?php echo $this->Form->end(array(
'label' => __('Submit'),
'class' => 'btn',
'div' => array(
'class' => 'control-group',
),
'before' => '<div class="controls">',
'after' => '</div>'
));?>
要生产:
<div class="control-group">
<div class="controls">
<input class="btn" type="submit" value="Submit">
</div>
</div>
小添加另一个注释:
如果你想要添加类并更改标签基本文本,你可以写下一个
<?php echo $this->Form->input('Fieldname', array(
'label' => array('class' => 'control-label','text'=>'HERE YOU LABEL TEXT')
)); ?>
我在使用 slywalker/cakephp-plugin-boost_cake 时遇到了同样的问题,我打开了一张票,他在几个小时内修复了它,他更新到 1,03 并告诉我像这样使用它
<?php echo $this->Form->input('email', array(
'label' => array(
'text' => __('Email:'),
),
'beforeInput' => '<div class="input-append">',
'afterInput' => '<span class="add-on"><i class="icon-envelope"></i></span></div>'
)); ?>
我希望它也对其他人有所帮助
为了让它在引导和靴子表的引导中与水平形式一起工作,我必须使用:
echo $this->Form->create(
'User',
array(
'action' => 'add',
'admin' => 'false',
'class' => 'form-horizontal',
'inputDefaults' => array(
'format' => array( 'before', 'label', 'between',
'input', 'error', 'after' ),
'class' => 'form-control',
'div' => array( 'class' => 'form-group' ),
'label' => array( 'class' => 'col-lg-2 control-label' ),
'between' => '<div class="col-lg-10">',
'after' => '</div>',
'error' => array( 'attributes' => array( 'wrap' => 'span',
'class' => 'text-danger' ) ),
)
)
);
然后你可以像往常一样使用它:
echo $this->Form->input( 'User.username' );
Luc Franken在他的评论中发布了这个链接:http://github.com/slywalker/cakephp-plugin-boost_cake
我花了一段时间才注意到它,所以对于那些仍在寻找最简单的解决方案的人:
只需从GitHub添加CakePHP Bootstrap插件,让助手为您完成工作!