ActiveField error message position

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?

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)

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;

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?

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

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

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.

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.

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>