jquery validation click событие для сообщения об ошибке - PullRequest
0 голосов
/ 12 декабря 2011

Я использую плагин проверки bassistance для JQuery.

Для сохранения формы я помещаю только одну букву в качестве Errormessage после недопустимого поля (например, «F» для недопустимого форматирования).Теперь я хочу дать пользователю возможность получить подробное сообщение об ошибке в специальном div (#errordetails), нажав на букву.

$(".contactForm").validate({
    rules ....
}),

...

Я хочу разместить что-то вроде этого:

$("label.error").click(function() {
    alert("The Errormessage was clicked ...");
})

Где я должен разместить этот код?

РЕДАКТИРОВАТЬ: Извините, я забыл написать это.В $ (document) .ready () события не работают.События кликов для других элементов работают нормально, но не события для $ ("label.error")

OK РЕДАКТИРОВАТЬ ЧАСТЬ 2:

Мой HTML после проверки:

<div class="formField cf">                          
    <label for="contactGeburt">Geb.datum *  
        <span style="font-size: 10px; color: #999">&nbsp;(dd.mm.jjjj)
        </span>
    </label>                            
    <input type="text" maxlength="10" id="gebdatum" name="gebdatum" class="textField datum error">
<label for="gebdatum" generated="true" class="error">
    <span class="errorvalue">P
    </span>
</label>                                                

И вот часть JQUERY

$(document).ready(function(){
$(".contactForm").validate({
  rules: {
    gebdatum: {
        required: true,
        dateDE: true
        }
    },
}),

//This does not work
$(function() {
  $("label.error").click(function() {
    alert("The Errormessage was clicked ...");
  });
});

// This works - H1 is also on the document ;-)
$(function() {
  $("h1").click(function() {
    alert("H1 was clicked ...");
  });
});    
});

РЕДАКТИРОВАТЬ ЧАСТЬ 3:

Спасибо за поддержку:

Я проверил (действительный) код, но он не работает.Я начал демопейдж с bassistance:

http://jquery.bassistance.de/validate/demo/

Я вставляю эту функцию:

$("label").click(function() {
  alert("The Label was clicked ...");
});

... и запускаю код (консоль).При нажатии на ярлыки из текстовых полей показывалось сообщение оповещения.После нажатия кнопки «отправить» метки ошибок (красные) не реагируют на событие, но метки для полей ввода показывают окно предупреждения.

Итак, я снова запускаю код с консоли (после появления ошибок на экране), и теперь показывается alterbox.

Так что я думаю, событие должно быть помещено в validate-событие из формы, но я не знаю правильный синтаксис.

РЕДАКТИРОВАТЬ ЧАСТЬ 4:

Вот ссылка на jsfiddle со всеми включенными отзывами: http://jsfiddle.net/frank79/HVEXm/

Спасибо за помощь !!!Извините за жалкий английский ...

Ответы [ 4 ]

2 голосов
/ 22 декабря 2011

Хорошо, у меня есть решение:

$(".contactForm").delegate("label", 'click', function() {
    alert("A Label was clicked....");
}).validate({
    rules: {
        gebdatum: {
            required: true,
            dateDE: true
        }
    }
})

Мой ярлык не существовал при вызове обработчика кликов.

Благодаря charlietfl из jquery-Forum и благодаря JMAXдля jsfiddle excurs!

С Рождеством!

Фрэнк

0 голосов
/ 22 декабря 2011

Метод .click () может привязать функцию только к событию click элемента, который находится в DOM во время вызова метода.

Поскольку метки ошибок добавляются в DOM позже, они не затрагиваются.

Вместо этого используйте метод .live () или jQuery 1.7+ .on ().

$("label").live("click", function() {
    alert("A Label was clicked....");
});
0 голосов
/ 13 декабря 2011

Вот ваш оригинальный код :: http://jsfiddle.net/2EwUK/

  • При нажатии на кнопку JSLint в верхней части веб-приложение вызывает некоторые синтаксические ошибки в вашем коде.
  • Вы не должны использовать несколько $(function() { }); внутри $(document).ready(), потому что это тот же код

Вот обновленный: http://jsfiddle.net/mwLWR/1/, и он работает. Благодаря комментарию я также добавил ссылку на плагин проверки.

0 голосов
/ 12 декабря 2011

Вы должны поместить свой код в функцию готовности документа jQuery, например:

$(function() {
  $("label.error").click(function() {
    alert("The Errormessage was clicked ...");
  });
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...