ActiveField error message position


(Shahzadwise) #1

I want to create an input group for first name, middle name, and last name fields, using following code:-

<div class="input-group">

&lt;?php         


echo &#036;form-&gt;field(&#036;model, 'f_name')-&gt;textInput(['maxlength' =&gt; true, 'placeholder' =&gt; 'First Name', 'style'=&gt;&quot;float: left; width: 34%;&quot;]);         


echo &#036;form-&gt;field(&#036;model, 'm_name')-&gt;textInput(['maxlength' =&gt; true, 'placeholder' =&gt; 'Middle Name', 'style'=&gt;&quot;float: left; width: 34%;&quot;]);         


echo &#036;form-&gt;field(&#036;model, 'l_name')-&gt;textInput(['maxlength' =&gt; true, 'placeholder' =&gt; 'Last Name', 'style'=&gt;&quot;float: left; width: 34%;&quot;]);





?&gt;

</div>

The problem is ActiveField auto generates input, error tags. Only First name is required, and i want client validation error message to be displayed only after the three input fields on new line

how can i do this?


(Softark) #2

I think you can consider using Html::activeTextInput() and Html::error() instead.

BaseHtml::activeTextInput(http://www.yiiframework.com/doc-2.0/yii-helpers-basehtml.html#activeTextInput()-detail)

BaseHtml::error() (http://www.yiiframework.com/doc-2.0/yii-helpers-basehtml.html#error()-detail)


(Shahzadwise) #3

Still not showing any error, my code is as following

    &lt;div class=&quot;input-group&quot;&gt;


        &lt;?php


        //echo &#036;form-&gt;field(&#036;model, 'f_name')-&gt;textInput(['maxlength' =&gt; true, 'placeholder' =&gt; 'First Name']);


        echo Html::activeInput('text', &#036;model, 'f_name', ['style'=&gt;&quot;float: left; width: 34%;&quot;, 'class'=&gt;'form-control', 'placeholder'=&gt;'First']);


        echo Html::activeInput('text', &#036;model, 'm_name', ['style'=&gt;&quot;float: left; width: 33%;&quot;, 'class'=&gt;'form-control', 'placeholder'=&gt;'Middle']);


        echo Html::activeInput('text', &#036;model, 'l_name', ['style'=&gt;&quot;float: left; width: 33%;&quot;, 'class'=&gt;'form-control', 'placeholder'=&gt;'Last']);


        echo Html::error(&#036;model, 'f_name');


        ?&gt;


    &lt;/div&gt;

(Softark) #4

Well, unfortunately, I think I’ve found the following by testing it by myself:

Html::error() doesn’t support either client-side validation or ajax validation.

So, would you please confirm it by turning off them in your form?


(Shahzadwise) #5

Yes, thats true. I have turned off both validations.


(Shahzadwise) #6

What else can be done, any thoughts please. How to attach client validation to a field other than ActiveForm/Field


(Softark) #7

Well, I would create a form like the following using ActiveFields:




+--------------------+--------------------+------------------+

|First Name (label)  |Second Name (label) |Last name (label) |

|First Name (input)  |Second Name (input) |Last name (input) |

|First Name (error)  |Second Name (error) |Last name (error) |

+--------------------+--------------------+------------------+



It could be done by specifying ActiveField::$template (http://www.yiiframework.com/doc-2.0/yii-widgets-activefield.html#$template-detail) and some appropriate CSS.

The labels may be totally omitted and the errors for the 2nd and 3rd names may be also omitted.


(Shahzadwise) #8

Ok, got the idea, now the problem is

The code

echo $form->field($model, ‘f_name’, [‘template’=>"{input}"])->textInput([‘maxlength’ => true]);

generates following html

<div class="form-group field-patient-f_name required">

<input type="text" id="patient-f_name" class="form-control" name="Patient[f_name]" maxlength="50">

</div>

It auto inserts the <div> tag, due to this i cannot format 3 name fields into input-group

is there anyway, that $form->field not generate these tags, i want only input tag to be generated.

thanx.


(Softark) #9

Assuming you are using bootstrap, something like the following will be a hint, I hope.

It doesn’t remove the enclosing ‘div’ tag from the field, but the 3 fields will be aligned horizontally in the form.




<div class="row">

    <div class="col-lg-6">

        <?php $form = ActiveForm::begin(['id' => 'contact-form']); ?>

        <div class="row">

            <div class="col-sm-4">

                <?= $form->field($model, 'name_1')->textInput() ?>

            </div>

            <div class="col-sm-4">

                <?= $form->field($model, 'name_2')->textInput() ?>

            </div>

            <div class="col-sm-4">

                <?= $form->field($model, 'name_3')->textInput() ?>

            </div>

        </div>

        <?= $form->field($model, 'email') ?>

        <?= $form->field($model, 'subject') ?>

        <?= $form->field($model, 'body')->textArea(['rows' => 6]) ?>

        <div class="form-group">

            <?= Html::submitButton('Submit', ['class' => 'btn btn-primary', 'name' => 'contact-button']) ?>

        </div>

        <?php ActiveForm::end(); ?>

    </div>

</div>