parsley.js 扩展错误消息文本

parsley.js extending error message text

根据设计,我使用上面的一个 div 表格来显示错误。为此,我还需要一些前缀,在每个错误消息之前,通常是来自相应标签标签的文本。

我将其实现为扩展,就像新功能一样,应该手动执行...但在这种情况下,我失去了默认的 ui 行为。

所以,问题是是否可以将这种行为作为欧芹的一部分(通过扩展欧芹)来实现?

您可以使用 errorsContainer 自定义 parsley 放置错误的位置。可以是在摘要区域内创建容器的函数。

该错误容器还可以包含您填充的某种其他信息。

需要更好的错误消息系统,请参见 this issue

我通过扩展两个内部函数实现了所需的行为。不确定这是个好主意,但在某些特定情况下它确实满足了我的需要:

(function ($) {

    function getFieldLabel(parsleyField, suffix) {
        var result = '',
            labels = $('label[for=' + parsleyField.$element.prop('id') + ']');

        suffix = suffix || '';
        if (labels.length) {
            result = labels[0].innerText + suffix;
        }

        return result;
    }

    window.ParsleyExtend = window.ParsleyExtend || {};
    window.ParsleyExtend = $.extend(window.ParsleyExtend, {
        // NB! this method replaces parsley's default `_addError`
        _addError: function _addError(name, _ref5) {
            var message = _ref5.message;
            var assert = _ref5.assert;

            this._insertErrorWrapper();
            this._ui.$errorsWrapper.addClass('filled').append($(this.options.errorTemplate).addClass('parsley-' + name).html(
                getFieldLabel(this, ' - ') + (message || this._getErrorMessage(assert))
            ));
        },

        // NB! this method replaces parsley's default `_updateError`
        _updateError: function _updateError(name, _ref6) {
            var message = _ref6.message;
            var assert = _ref6.assert;

            this._ui.$errorsWrapper.addClass('filled').find('.parsley-' + name).html(
                getFieldLabel(this, ' - ') + (message || this._getErrorMessage(assert))
            );
        }
    });

})(jQuery);