plugin jquery validation - changement de couleur de la bordure + pas de texte

Est-il de toute façon je peux changer à la frontière de la couleur rouge sur une erreur plutôt et de se débarrasser de ce texte? C'est à peu près la seule erreur que je veux afficher, et elle allait disparaître une fois que l'entrée/textarea devient concentré.

<div id="contact-form">
            <form method="get" id="contacts">
                <div class="contact-controls">
                    <label class="contact-label" for="name-input">NAME</label>
                    <div class="input-wrapper">
                        <input type="text" name="contact-name" id="name-input" placeholder="Your Name" required>
                    </div>
                </div>
                <div class="contact-controls">
                    <label class="contact-label" for="email-input">EMAIL</label>
                    <div class="input-wrapper">
                        <input type="text" name="contact-email" id="email-input" placeholder="Your Email" required>
                    </div>
                </div>
                <div class="contact-controls">
                    <label class="contact-label" for="message-input">MESSAGE</label>
                    <div class="input-wrapper">
                        <textarea name="contact-message" id="message-input" rows="15" placeholder="Hi there&#33;" required></textarea>
                    </div>
                </div>
                <div class="contact-controls">
                    <input type="hidden" name="save" value="contact">  
                    <button type="submit" class="contact-button">Send</button>  
                </div>
            </form>
        </div>
nous aurions besoin de voir votre script de validation qui est de "se débarrasser du texte"
Ah, je ne l'ai pas encore, je me demandais si il existe un moyen, ou un plugin qui permet de faire ce que je suis à la recherche d'
Oui, il est un moyen facile. Voir ma réponse.

OriginalL'auteur vytfla | 2013-03-25

  1. 16

    Procédez de la manière suivante:

    1) Définir la errorPlacement fonction de rappel pour return false pour supprimer le texte du message d'erreur.

    2) Modifier les règles CSS du plugin .error & .valid class's pour afficher les bordures colorées, ou que ce soit, autour de l'élément. Par défaut, le plugin déjà s'applique automatiquement et supprime ces deux class's, donc il n'y a aucun plugin options à configurer pour ce.

    De travail de DÉMONSTRATION: http://jsfiddle.net/8vQFd/

    jQuery:

    $(document).ready(function () {

    $('#myform').validate({ //initialize the plugin
        //your rules and options,
        errorPlacement: function(){
            return false;  //suppresses error message text
        }
    });

});
    Doux, c'est parfait. Question: au chargement de la page de mon premier champ de saisie affiche déjà une erreur.erreur { border: 1px rouge solide}); comment puis-je le faire donc il ne signale une erreur une fois que l'utilisateur entre des caractères incorrects?
    Il suffit de suivre mon jsfiddle qui a déjà fait ce que vous voulez. Puisque je ne peux pas voir votre .validate() fonction, je ne suis pas sûr de savoir comment ce qui se passe. Pouvez-vous modifier mon jsFiddle pour montrer cette question?
    jsfiddle.net/8vQFd
    c'est juste mon premier jsFiddle et pas d'erreurs sont mises en évidence sur la charge. Vous devez cliquez sur "mettre à jour" ou "fourchette" bouton pour enregistrer toutes les modifications.
    Ah stupide de moi, merci: jsfiddle.net/RaPUY

    OriginalL'auteur Sparky

  2. 0

    Pas de Jquery Sans Ajouter d'autres/Modifier Toute Fonctionnalité vient d'Ajouter Css

    input[class="error"]{border:1px solid #f00 !important;} input[class="form control error"]{border:1px solid #f00 !important;} .error p{color:#f00 !important;}

    OriginalL'auteur

  3. -1

    Vous pouvez ajouter une classe à votre entrée /textareas qui permettrait d'ajouter une bordure rouge

    Je l'ai appelé .erreur

    input:focus,textarea:focus{
outline: none !important;
}

input.error, textarea.error{
outline:red groove thin;
}

    Puis utiliser jquery pour aller trouver l'entrée /textareas avec la classe".erreur " et vide de définir la valeur à vide.

    $(document).ready(function() {
  $('#contact-form').find('.error').val(' ');
});

    Jsfiddle V1

    Mis à jour

    Exemple de JS

     $(document).ready(function() {
  $('#contact-form').find('.error').val(' ');
    $('input, textarea').click(function() {
    $(this).removeClass('error').val('');
   });

    var name = $('#name-input').val();

    if(name == ''){
      $('#name-input').addClass('error');   
    }
   });

    CSS

     input:focus,textarea:focus{
  border-color: initial;
 }

 input.error, textarea.error{
  border:1px solid red;
 }

    HTML

    <div id="contact-form">
        <form method="get" id="contacts">
            <div class="contact-controls">
                <label class="contact-label" for="name-input">NAME</label>
                <div class="input-wrapper">
                    <input type="text" name="contact-name" id="name-input" placeholder="Your Name" value="" class="" required>
                </div>
            </div>
            <div class="contact-controls">
                <label class="contact-label" for="email-input">EMAIL</label>
                <div class="input-wrapper">
                    <input type="email" name="contact-email" id="email-input" placeholder="Your Email" value="" class="" required>
                </div>
            </div>
            <div class="contact-controls">
                <label class="contact-label" for="message-input">MESSAGE</label>
                <div class="input-wrapper">
                    <textarea name="contact-message" id="message-input" rows="15" placeholder="Hi there&#33;" class="" required></textarea>
                </div>
            </div>
            <div class="contact-controls">
                <input type="hidden" name="save" value="contact">  
                <button type="submit" class="contact-button">Send</button>  
            </div>
        </form>
    </div>

    JSfiddle V2

    Votre jsfiddle a l'e-mail/message frontières déjà rouge; je suis à la recherche pour eux de changer de rouge une fois que l'utilisateur appuie sur envoyer lorsque les champs sont vides.
    Qui jamais langue que vous utilisez pour traiter les données vous si il y a une erreur ajouter la classe "erreur" de la zone de saisie, (vous pouvez également définir la valeur de cette manière aussi)
    J'ai mis à jour ma réponse
    Je pense que vous avez totalement manqué le point. L'OP est à l'aide de jQuery Valider plugin qui a déjà des divers intégré dans les options de rappel pour faire tout cela.

    OriginalL'auteur Eli Stone