如何将 yii2 表单错误放在锚标记的标题中

如何将 yii2 表单错误放在锚标记的标题中

这是我的代码

$form = ActiveForm::begin([
    'id' => 'login-form',
    'options' => ['class' => 'form-horizontal'],
    'fieldConfig' => [
        'template' => '
            {label}
            <div class="error-block">
                <a href="#" title="{error}">error</a>
            </div>
            {input}
            ',
        'errorOptions' => ['tag' => null]
    ],
]);

我想在 YII2 中的锚标签标题中添加错误

<a href="#" title="{error}">error</a>

您需要在锚标记内显示错误文本title属性，并使用template选项不会帮助您自动实现它。

你的方法中有一些事情。

• 您正在指定"tag"=>null在下面errorOptions这不会创建默认的 html<p class="help-block help-block-error"></p>.

• 即使您将标签指定为div or span即使如此，它也会破坏 HTML，因为属性标题有双引号<a href="#" title="{error}">error</a>并且创建的标签也将带有双引号<div class="help-block help-block-error"></div>.

• 那么如果你改变<a href="#" title="{error}">error</a> to <a href="#" title=\'{error}\'>error</a>修复损坏的HTMLJavaScript 将无法检测到该元素。

那么接下来的事件afterValidateAttribute将在验证整个表单和每个属性后触发，来拯救您。

事件处理程序的签名应该是：

function (event, attribute, messages)

where

• event：一个事件对象。

• attribute：正在验证的属性。请参阅attributeDefaults对于这个参数的结构。

• messages：一个数组，您可以向其中添加指定属性的其他验证错误消息。

现在改变template在下面fieldConfig到以下内容并删除{error}从模板和errorOptions，因为不需要它，只需将自定义错误元素保留在模板内即可。

'fieldConfig' => [
    'template' => '
        {label}
        <div class="error-block">
            <a href="#" title="">error</a>
        </div>
        {input}
        ',
],

现在，将以下 javascript 添加到要呈现表单的视图顶部。

$js = <<< JS
$("#login-form").on(
    'afterValidateAttribute',
    function (event,attribute,messages) {
        let input=attribute.input;
        $(input).siblings('.error-block').find('a').attr('title',messages.join(','));
    }
);
JS;
$this->registerJs($js, \yii\web\View::POS_READY);

现在如果你focus超出字段或点击提交按钮，您将看到错误消息填充在title的属性a tag.