2015-02-10 2 views
1

Я пытаюсь добавить стили css в сообщения об ошибках, которые появляются с помощью проверки JQuery. они находятся под сообщениями. Я новичок в JQuery. Я попытался добавить класс css в сообщение об ошибке без эффекта.JQuery - проверка формы, добавление стилей CSS для сообщений об ошибках


HTML Форма


<form method="post" action="mail.php" id="contact-form"> 
        <div class="form-group"> 
        <label for="name">Name</label> 
        <input type="Text" class="form-control" name="name" id="name" placeholder="Enter Name"> 
        </div> 
        <div class="form-group"> 
        <label for="subject">Subject</label> 
        <input type="text" class="form-control" name="subject" id="subject" placeholder="Enter Subject"> 
        </div> 
        <div class="form-group"> 
        <label for="email">Email address</label> 
        <input type="email" class="form-control" name="email" id="email" placeholder="Enter Email"> 
        </div> 
        <div class="form-group"> 
        <label for="comment">Message</label> 
        <input type="text" class="form-control" name="comment" id="comment" placeholder="Enter Message"> 
        </div> 

        <button type="submit" value="submit" name="submit" class="btn btn-default">Submit</button> 
       </form> 

Jquery


<script type="text/javascript"> 
       $('#contact-form').submit(function() { 
       $('#loadingimage').show(); 
       $('#loadingtext').show(); 
       }); 
    </script> 

    <script type="text/javascript"> 
     (function($,W,D) 
     { 
      var JQUERY4U = {}; 

      JQUERY4U.UTIL = 
      { 
       setupFormValidation: function() 
       { 
        //form validation rules 
        $("#contact-form").validate({ 
         rules: { 
          name: "required", 
          subject: "required", 
          email: { 
           required: true, 
           email: true 
          }, 
          comment: "required" 
         }, 
         messages: { 
          name: "Please enter your Name", 
          subject: "Please enter a Subject", 
          email: "Please enter a valid Email Address", 
          comment: "Please enter your Message", 

         }, 
         submitHandler: function(form) { 
          form.submit(); 
         } 
        }); 
       } 
      } 

      //when the dom has loaded setup form validation rules 
      $(D).ready(function($) { 
       JQUERY4U.UTIL.setupFormValidation(); 
      }); 

     })(jQuery, window, document); 
     </script> 
+0

Этот код jQuery4U ничего, но слишком сложным нонсенс; все можно упростить. Он не служит никакой полезной цели, кроме как вызвать больше путаницы для новых пользователей. [Пожалуйста, просмотрите страницу Wiki Wiki, чтобы увидеть, как можно значительно упростить ваш код] (http://stackoverflow.com/tags/jquery-validate/info) – Sparky

ответ

1

попробуйте добавить errorClass:'error',

$("#contact-form").validate({ 
          rules: { 
           name: "required", 
           subject: "required", 
           errorClass:'error', 
           email: { 
            required: true, 
            email: true 
           }, 
           comment: "required" 
          }, 
          messages: { 
           name: "Please enter your Name", 
           subject: "Please enter a Subject", 
           email: "Please enter a valid Email Address", 
           comment: "Please enter your Message", 

          }, 
          submitHandler: function(form) { 
           form.submit(); 
          } 
         }); 
+1

отлично работает. – jonathanl5660

Смежные вопросы