как использовать, если правило в JQuery - PullRequest
Новая
       19

как использовать, если правило в JQuery

0 голосов
/ 30 июля 2009

Привет У меня есть простое модальное всплывающее окно, которое имеет 3 поля имени и 3 поля электронной почты, смежные друг с другом. Я новичок в jQuery, поэтому кто-нибудь может мне помочь, как написать логику для следующего случая?

Поле имени и поле электронной почты являются обязательными, поэтому я сохранил класс как обязательные поля, но два других поля имени и электронной почты являются необязательными, но если я ввожу значение в поле имени, я должен ввести значение в поле электронной почты , Другими словами, если поле имени не является пустым, поле электронной почты не должно быть пустым. Пожалуйста, дайте мне знать, если кто-то может мне помочь, спасибо.

Код jQuery выглядит следующим образом: он получает данные из ajax 

function shareWithAFriend(itemId) {
        $.ajax({
            url: "shareWithAFriend.do?itemId="+itemId,
            type: "GET",
            success: function(html) {
                $("#tellInfoPop").html(html);
                $("#itemId").val(itemId);
                $("#emailFriend").validate({
                    errorClass: "formError",
                    errorContainer: "#referAFriendFormError",
                    errorLabelContainer: "#referAFriendFormError",
                    onfocusout: false,
                    wrapper: 'li',
                    messages: {
                        referName01: {
                            required: "<@spring.message "referAFriend.error.nameRequired"/>"
                        },
                        referEmail01: {
                            required: "<@spring.message "referAFriend.error.emailRequired"/>",
                            email: "<@spring.message "referAFriend.error.emailFormat"/>"
                        },
                        referEmail02: {
                            email: "<@spring.message "referAFriend.error.emailFormat"/>"
                        },
                        referEmail03: {
                            email: "<@spring.message "referAFriend.error.emailFormat"/>"
                        },
                        securityKey: {
                            required: "<@spring.message "referAFriend.error.securityRequired"/>"
                        }
                    },
                    groups: {
                        emailGroup: "referEmail01 referEmail02 referEmail03"
                    },

HTML-код как пара 

<div class="leftCol">
        <label for="emailToName1" class="formLabel"><span class="required">*</span>Name:</label>
      <div><input type="text" id="emailToName1" name="referName01" value="${referAFriendBean.referName01!}" class="required" tabindex="1" /></div>
      <div class="pad5Top"><input type="text" id="emailToName2" name="referName02" value="${referAFriendBean.referName02!}" tabindex="3" /></div>
      <div class="pad5Top"><input type="text" id="emailToName3" name="referName03" value="${referAFriendBean.referName03!}" tabindex="5" /></div>
    </div>

    <div class="rightCol">
        <label for="emailToAddress1" class="formLabel"><span class="required">*</span>Email address:</label>
      <div><input type="text" id="emailToAddress1" name="referEmail01" value="${referAFriendBean.referEmail01!}" class="required email" tabindex="2" /></div>
      <div class="pad5Top"><input type="text" id="emailToAddress2" name="referEmail02" class="email" tabindex="4" value="${referAFriendBean.referEmail02!}" /></div>
      <div class="pad5Top"><input type="text" id="emailToAddress3" name="referEmail03" class="email" tabindex="6" value="${referAFriendBean.referEmail03!}" /></div>
    </div>
  </div>

1 Ответ

0 голосов
/ 30 июля 2009

Я думаю, вы могли бы добавить обработчик событий для вашего необязательного элемента name, который будет динамически добавлять или удалять необходимый класс для адреса.

Я не знаю, выбираю ли я здесь правильные идентификаторы, но вы должны понять: 

$('#emailToName2').keyup(function () {
    if ($(this).val()) {
        $('#emailToAddress2').addClass('required');
    } else {
        $('#emailToAddress2').removeClass('required');
    }
});

или даже укороченная версия, но может быть менее читабельной, если вы новичок в jQuery 

$('#emailToName2').keyup(function () {
    $('#emailToAddress2').toggleClass('required', $(this).val());
});
...