Очистить иконки проверки JQuery на форме - PullRequest
Новая
       22

Очистить иконки проверки JQuery на форме

0 голосов
/ 11 сентября 2018

Мне нужно очистить все сообщения об ошибках валидации и значки валидации при щелчке мышью за пределами слайда в меню.

Но несмотря на то, что форма сброса и сообщения об ошибках удалены, крестик остается неизменным.Мне нужно удалить все данные, когда я нажимаю за пределами меню.

enter image description here

Я использую приведенный ниже код для сброса формы и удаления сообщений проверки.

<script>
  $('.overlay').on('click', function(){    
     $("#ohut-innate-form")[0].reset();    
     $('#navbarSide').removeClass('reveal');
     $('.overlay').hide();
     $(".error").html('');
     $(".error").removeClass("error");
     $("ohut-innate-form").validate().resetForm();   
  });
</script>

Вот моя форма 

<form class="ohut-innate-form" id="ohut-innate-form" name="ohut-innate-form" method="post">
                        <span class="form-group">
                        <label >Email Address</label>
                        <input type="email" name="emailReg" id="emailReg" class="validate" required>
                        </span>
                        <span class="form-group">
                        <label>Password</label>
                        <input type="password" name="passwordReg" id="passwordReg" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Confirm Password</label>
                        <input type="password" name="cpassword" id="cpassword" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Name</label>
                        <input type="text"  name="name" id="name" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Contact Number</label>
                        <input type="text" name="contact" id="contact" class="validate">
                        </span>
                        <input type="hidden" id="baseUrlReg" value="<?php echo base_url(); ?>">
                        <button type="submit" id="submit" class="btn  btn-block btn-primary mr-2" name="Login">Register</button>
                       <!-- <a href="#"  name="Login"  id="register_user" onclick="registerUser()" class="btn  btn-block btn-primary mr-2">Register</a> -->

                        <div class="formrow left" style="visibility: hidden;">
                            <div class="mainlableContent">
                                <input class="formtext" type="text" name="mid" id="mid" value="<?php echo $merchantid; ?>" >
                                <span class="glyphicon glyphicon-remove right errorcross" id="email_cross" style=""></span>
                            </div>
                        </div>
                    </form>

Как мне удалить красный крестик?

1 Ответ

0 голосов
/ 11 сентября 2018

Не уверен, что это то, что вы искали, но так как вы пометили jQuery, вы можете использовать $(window).click(function(){ }); для регистрации кликов за пределами ваших элементов, а затем применять логику вокруг этого. Вы можете настроить таргетинг своих элементов по классу, имени или идентификатору, в зависимости от того, что кажется наиболее удобным.

Кроме того, когда вы выходите из элемента, хотите ли вы очистить сообщения проверки и скрыть крестик всех элементов или только тот, который вы вышли?

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

Примером может быть: 

$(window).click(function() {
    $(".error").html(''); //this is your validation/error message that will be cleared
    $('.right errorcross').hide(); //this is your red cross that will be hidden
});

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

...