Question

要使用Bootstrap框架正确显示单选按钮，您需要将它们包含在标签中。像这样：

<div class="radio">
    <label>
        <input type="radio" name="sex" id="sex-male" value="m">Male
    </label>
</div>

我试图用Laravel完成这个任务，但我只能将标签作为一个单独的元素。

<div class="radio">
    {{ Form::label('sex-male', 'Male') }}
    {{ Form::radio('sex', 'm', true, ['id' => 'sex-male']) }}
</div>

生成此HTML：

<div class="radio">
    <label for="sex-male">Male</label>
    <input id="sex-male" checked="checked" name="sex" type="radio" value="m">
</div>

那么获取与第一个代码块匹配的HTML的策略是什么？

更新

显而易见的方法是作弊并这样做：

<label>
    {{ Form::radio('sex', 'm', true) }}Male
</label>

但是有更好的方法吗？

结论

@lukasgeiter指出，没有内置的方法可以做到这一点。所以上述结构不一定是“错误的”。对于第三方的方式，请参阅答案。

Answer 1

有一个名为Laravel Bootstrapper的有用贡献模块，允许您使用以下格式：

{{ Form::inline_labelled_radio('radio', 'm', 'Male') }}

可以找到安装说明here

Answer 2

由于您询问是否有更好的方法，我发现使用Laravel Collective的Custom Components可以完成以下操作：

在App \ Http \ Providers \ FormServiceProvider.php的boot（）函数中注册以下内容

Form::component('bsRadio', 'components.form.radio', [
                                                      'name',
                                                      'labeltext' => null,
                                                      'value' => null,
                                                      'disabled' => null,
                                                      'inline' => null,
                                                      'attributes' => []
                                                    ]
                );

在resources \ views \ components \ form \ radio.blade.php中具有以下内容：

@if(is_null($inline))
<div class="radio {{$disabled}}">
@endif
<?php
$a_disabled = [];
$s_disabled = '';
$s_inline = '';
if (!is_null($disabled)) {
  $a_disabled = ['disabled'=>'disabled'];
  $s_disabled = 'disabled';
}
if (!is_null($inline)) {
  $s_inline = 'class="radio-inline"';
}
?>
  <label {{$s_disabled}} {!!$s_inline!!}>{{ Form::radio($name, $value, $attributes, $a_disabled) }}{{$labeltext}}</label>
@if(is_null($inline))
</div>
@endif

然后在视图中显示示例代码如下：

{{ Form::bsRadio('course', 'NLP Master', 'M', 'disabled' )}}
{{ Form::bsRadio('course', 'NLP Practitioner', 'P' )}}
{{ Form::bsRadio('course', 'Professional Blog', 'B', null, null, ['checked'] )}}

这将产生以下HTML

<div class="radio disabled">
  <label disabled ><input disabled="disabled" name="course" type="radio" value="M">NLP Master</label>
</div>
<div class="radio ">
  <label  ><input name="course" type="radio" value="P">NLP Practitioner</label>
</div>
<div class="radio ">
  <label  ><input checked="checked" name="course" type="radio" value="B">Professional Blog</label>
</div>

上述单个组件也可以通过仅将inline参数传递为'inline'来处理嵌入式无线电。

在Laravel中用一个标签封闭单选按钮

2 个答案: