Partage
  • Partager sur Facebook
  • Partager sur Twitter

{Jquery} Afficher le submit si tout les champs sont remplis

    11 août 2010 à 17:33:51

    Bonjour, comme le dit le titre, j'ai besoin de savoir comment je pourrais affiché le boutons submit si, tout les champ sont bien remplis.

    Voici mon formulaire :

    <form action="admin.php?admin=tuto_choisir_cat" method="post">
    <fieldset><legend>Titre</legend>
    <input type="text" size="80" id="titre" name="titre" />
    <div class="error-message"></div>
    </fieldset>
    
    <fieldset><legend>Url de la video</legend>
    <input type="text" size="80" id="video" name="video" />
    <div class="error-message"></div>
    
    </fieldset>
    
    <fieldset><legend>Mise en forme</legend>
    <input type="button" id="gras" name="gras" value="Gras" onClick="javascript:bbcode('[g]', '[/g]');return(false)" />
    <input type="button" id="italic" name="italic" value="Italic" onClick="javascript:bbcode('[i]', '[/i]');return(false)" />
    <input type="button" id="soulign&#233;" name="soulign&#233;" value="Soulign&#233;" onClick="javascript:bbcode('[s]', '[/s]');return(false)" />
    <input type="button" id="lien" name="lien" value="Lien" onClick="javascript:bbcode('[url]', '[/url]');return(false)" />
    <br /><br />
    <img src="Design/images/smileys/^^.gif" title="^^" alt="^^" onClick="javascript:smilies('^^');return(false)" />
    <img src="Design/images/smileys/arf.gif" title=":/" alt=":/" onClick="javascript:smilies(':/');return(false)" />
    <img src="Design/images/smileys/cool.gif" title=":)" alt=":)" onClick="javascript:smilies(':)');return(false)" />
    <img src="Design/images/smileys/frown.gif" title=":(" alt=":(" onClick="javascript:smilies(':(');return(false)" />
    <img src="Design/images/smileys/happy.gif" title=":D" alt=":D" onClick="javascript:smilies(':D');return(false)" />
    <img src="Design/images/smileys/lol.gif" title="lol" alt="lol" onClick="javascript:smilies('lol');return(false)" />
    <img src="Design/images/smileys/mad.gif" title=":o" alt=":o" onClick="javascript:smilies(':o');return(false)" />
    <img src="Design/images/smileys/mdr.gif" title="mdr" alt="mdr" onClick="javascript:smilies('mdr');return(false)" />
    
    <fieldset><legend>Message</legend>
    <textarea cols="80" rows="8" id="message" name="message"></textarea>
    <div class="error-message"></div>
    </fieldset>
    <p>
    <input type="submit" class="submit" value="Envoyer" id="envoyer"/>
    </p>
    </form>
    


    Est niveau JS, je ne c'est pas trop comment faire, je suis tomber sur la fonction val() et length(), j'ai essayer de combiner les 2, mais sa ne marche pas.

    $('#submit').hide(); 
    $("#titre").keydown(function() {
    if($("titre").val().length > 2) {
    $('#submit').show(); 
    }
    });
    


    Citation : Erreur Firebug


    $("titre").val() is undefined
    if($("titre").val().length == 2) {



    Merci, d'avance.
    • Partager sur Facebook
    • Partager sur Twitter
      11 août 2010 à 17:41:45

      Tu as oublié le # devant titre à cette ligne ;)
      • Partager sur Facebook
      • Partager sur Twitter
      Directeur technique, créateur de jeux HTML5 et fan de JavaScript | La suite de OnHack est sur les rails !
        11 août 2010 à 19:11:22

        Ha, oui en effet, c'était normal ^^
        Merci.

        Mais, comment je pourrais transformer sa :

        $('#envoyer').hide(); 
        
        $("#titre").keyup(function() {
        if($("#titre").val().length >= 5) {
        $('#envoyer').show(); 
        }
        else
        {
        $('#envoyer').hide(); 
        }
        });
        


        Pour y mettre les autres input => video et message.
        Il faut que les 3 champs soit remplis pour affiché le submit.

        Merci, d'avance. :D


        Non, en faite, c'était top simple :p

        $('#envoyer').hide(); 
        
        $("#titre")&&$("#video")&&$("#message").keyup(function() {
        if($("#titre")&&$("#video")&&$("#message").val().length >= 5) {
        $('#envoyer').show(); 
        }
        else
        {
        $('#envoyer').hide(); 
        }
        });
        


        • Partager sur Facebook
        • Partager sur Twitter
          11 août 2010 à 19:15:50

          En utilisant les opérateurs logiques ?
          http://www.commentcamarche.net/content [...] ques-booleens
          • Partager sur Facebook
          • Partager sur Twitter
          Directeur technique, créateur de jeux HTML5 et fan de JavaScript | La suite de OnHack est sur les rails !
            11 août 2010 à 19:18:49

            Oui, je savais qu'il fallait utilisé sa mais, je ne savais pas comment les mettres dans mon code... c'était super simple en faite :D

            Merci, encore. ^^

            Edit:

            J'aimerais pourvoir rajouté un dernier petit truc... j'aimerais que le submit s'affiche si tout les champs sont bien remplis et que le value de video soit égal à la regex

            Mais, la sa na marche pas...

            $('#envoyer').hide(); 
            
            $("#titre")&&$("#video")&&$("#message").keyup(function() {
            if($("#titre")&&$("#video")&&$("#message").val().length >= 5) {
            if(!$("#video").val().match(/^http:\/\/(?:www\.)?youtube.com\/watch\?v=\w+(&\S*)?$/)) {
            $('#envoyer').show(); 
            }
            else
            {
            $('#envoyer').hide(); 
            }
            }
            else
            {
            $('#envoyer').hide(); 
            }
            });
            


            Merci d'avance. ^^
            • Partager sur Facebook
            • Partager sur Twitter

            {Jquery} Afficher le submit si tout les champs sont remplis

            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
            × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
            • Editeur
            • Markdown