1
votes

I have a file input in my ActiveForm and I want to style it but classes btn btn-primary doesn't have any effect on that

<?php
use yii\widgets\ActiveForm;
?>
<div class="jumbotron">
<?php $form = ActiveForm::begin(['options' => ['enctype' => 'multipart/form-data']]) ?>

<?= $form->field($model, 'file',['class'=>'btn btn-primary'])->fileInput() ?>

<button class="btn btn-default">Submit</button>

<?php ActiveForm::end() ?>
</div>

At this point everything is well fine. However, when I try to use the parameter options of the field method as follows:

<?= $form->field($model, 'file',['class'=>'btn btn-primary'])->fileInput() ?>

I have got the error:

Class btn btn-primary does not exist

but I used 'btn btn-primary' class in

 <button class="btn btn-default">Submit</button>

and it worked very well.

Could anybody explain me why this error has been occurred?!

1

1 Answers

3
votes

In total approach you can't style file button directly
You can make the primary file input hidden and use another button.
When this button clicked, you must trigger the click event of input file using js or jquery

Or you can write it like below

<?= $form->field($model, 'file')->label(null,['class'=>'btn btn-primary'])
                                ->fileInput(['class'=>'sr-only']) ?>