yii2活动形式的Bootstrap 3复选框CSS样式

Question

我有第三方CSS，我想在Yii2 ActiveForm使用它。

这里的问题是：我应该如何将类赋予表单字段？ 我尝试了以下操作，但无法获得所需的输出。

<div class="checkbox checkbox-success">
    <?= $form->field($model, 'is_sold')->checkbox(); ?>
</div>

我还尝试了以下方法：

<div class="checkbox">
    <?= $form->field($model, 'is_sold')->checkbox(['class'=>'checkbox-success']); ?>
</div>

但是它呈现如下HTML代码：

<div class="checkbox checkbox-success">
<div class="form-group field-mainads-is_sold has-success">

<input type="hidden" name="MainAds[is_sold]" value="0">
   <label>
     <input type="checkbox" id="mainads-is_sold" name="MainAds[is_sold]" value="1">
     Mark as Sold
   </label>
</div>        
</div>

我想要的期望输出如下所示：

<div class="checkbox checkbox-success">
    <input class="styled styled" id="checkbox10" type="checkbox">
    <label for="checkbox10">
        This too
    </label>
</div>

我也尝试过这个：

 <?= $form->field($model, 'is_sold', ['options' =>  ['class' => 'checkbox checkbox-success']])->checkbox([] ,false) ?>

但是它不能很好地工作，并且输出如下：

<div class="checkbox checkbox-success field-mainads-is_sold has-success">
    <label class="control-label" for="mainads-is_sold">Mark as Sold</label>
    <input type="hidden" name="MainAds[is_sold]" value="0">
    <input type="checkbox" id="mainads-is_sold" name="MainAds[is_sold]" value="1">
</div>

下图中的第一个复选框是直接编写HTML代码后得到的，但是我想使用ActiveForm字段来实现。 图像中的第二个复选框是我使用表单域代码得到的。

Answer 1

我找到了解决方案。 尝试这个：

<?php $checkboxTemplate = '<div class="checkbox i-checks">{beginLabel}{input}{labelTitle}{endLabel}{error}{hint}</div>'; ?>
<?= $form->field($model, 'rememberMe')->checkbox(['template' => $checkboxTemplate]); ?>

我的结果是：

<div class="form-group field-loginform-rememberme">
    <div class="checkbox i-checks">
        <label for="loginform-rememberme">
            <input type="hidden" name="LoginForm[rememberMe]" value="0">     
            <input type="checkbox" id="loginform-rememberme" name="LoginForm[rememberMe]" value="1" checked="">
            Remember Me
        </label>
        <p class="help-block help-block-error"></p>
    </div>
</div>

Answer 2

如果您正在寻找实现CSS设计的方法，则可以使用此模板路线。

<?
    $checkboxTemplate = '<label>Terms and Conditions</label><div class="switch">{beginLabel}No{input}{labelTitle}<span class="lever"></span>Yes{endLabel}{error}{hint}</div>';
    echo $form->field($model, 'terms', ['options' =>  ['class' => 'form-group required']])->checkbox(['template' => $checkboxTemplate])->label('');
?>

Answer 3

尝试类似的东西：-

 <?= $form->field($model, 'is_sold' ,['options' =>  ['class' => 'checkbox checkbox-success']])->checkbox([] ,false) ?>