Плагин проверки JQuery - как добавить сообщения об ошибках в атрибут заголовка? - PullRequest
1 голос
/ 19 ноября 2011

Я везде искал ответ на этот вопрос, и хотя есть много похожих вопросов, ни один из них не работает точно так, как я хочу.

Я использую плагин JQuery Validator для веб-формы.Из-за конструктивных ограничений я не хочу, чтобы сообщение об ошибке добавлялось к предыдущему элементу.В настоящее время у меня это работает, когда он добавляет определенный класс к вводу, который является недопустимым, используя выделение, а также добавляя сводку внизу формы.Никаких проблем там нет.

Однако я считаю, что одного этого недостаточно, поскольку пользователь все еще не знает, почему конкретное место является недействительным.У меня действительно нет места для автоматического отображения сообщения об ошибке;однако я прочитал в документации, что вы можете добавить сообщение об ошибке в атрибут title, что я и хочу сделать.Цитируется с сайта:

Сообщение об ошибке отображает подсказку для пользователя о недопустимых элементах и ​​о том, что не так.Существует три способа предоставления сообщений об ошибках.С помощью атрибута title входного элемента для проверки, с помощью меток ошибок и настроек плагина (опционных сообщений).

Однако он не показывает, как на самом деле добавить сообщение об ошибке в атрибут title.Итак, вот что я имею до сих пор, что я могу сделать в этой ситуации?

К вашему сведению: я понимаю, что мне придется добавить сообщения об ошибках обратно вместо того, чтобы иметь «» в качестве сообщения.

$(document).ready(function() {
    $("#popcornOrder").validate({
            rules: {
                fName:      "required",
                lName:      "required",
                street:     "required",
                city:       "required",
                state:      "required",
                zip:        {required: true, ziprange: true},
                accountNum: "required",
                email:      {required: true, email: true},
                pwd:        "required",
                confPwd:    {required: true, equalTo: "#pwd"},
                payment:    "required"
            },
            messages: {
                fName:      "",
                lName:      "",
                street:     "",
                city:       "",
                state:      "",
                zip:        "",
                accountNum: "",
                email:      "",
                pwd:        "",
                confPwd:    "",
                payment:    ""

            },
            highlight:
                function(element) {
                    $(element).addClass('errorBorder');
                },
            unhighlight:
                function(element) {
                    $(element).removeClass('errorBorder');
                },
            invalidHandler: function(form, validator) {
                var errors = validator.numberOfInvalids();
                    if (errors) {
                         var message = errors == 1
                            ? 'You missed 1 field. It has been highlighted'
                            : 'You missed ' + errors + ' fields. They have been highlighted';
                         $("div.error span").html(message);
                         $("div.error").show();
                         } else {
                        $("div.error").hide();
                    }
             },
             focusInvalid: false
    });
});

РЕДАКТИРОВАТЬ: Хорошо, я сделал еще один шаг ближе: если я добавлю следующую строку, это добавит сообщение к атрибуту заголовка (это был просто обычный JQuery), НО добавляет сводку сообщения кВСЕ названия.Таким образом, реальный вопрос заключается в том, как добавить конкретные ошибки к каждому из входных данных?

$("input").attr("title", message);

Ответы [ 2 ]

3 голосов
/ 19 ноября 2011

Вы уже пробовали это?

errorPlacement: 
    function(error, element) {
        $(element).prop("title", error.text());
    },

И удалить это ...

unhighlight:
    function(element) {
        $(element).removeClass('errorBorder').prop("title", "");
    },
0 голосов
/ 19 ноября 2011

Вам необходимо однозначно идентифицировать вход.

$("input[name=foo]").attr("title", message);

Где foo - имя входа.Я подозреваю, что это будет совпадать с именем нарушенного правила (например, fName, lName и т. Д.).Очевидно, вам нужно будет делать это для каждой вашей ошибки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...