Partage
  • Partager sur Facebook
  • Partager sur Twitter

Afficher des champs selon le liste deroulante

Sujet résolu
    21 février 2018 à 13:03:09

    Bonjour à tous, 

    j'ai une problématique :

    j'ai un formulaire ou je souhaite afficher une liste déroulante et ensuite des champs input ou textarea. 

    jusque la ca va 

    mais la ou ca se corse c'est que selon le choix que je ferai dans ma liste déroulante je souhaite que cela m'affiche 1 ou plusieurs input/textarea.

    avec le script ci-dessous j'y arrive.

    malheureusement je ne fais que cacher les champs inutilisés du coup le bouton submit se retrouve tout en bas alors que je souhaiterai qu'il se positionne juste en dessous du dernier input visible. 

    'dans le code ci-dessous je n'ai mis que 2 choix dans ma liste déroulante mais j'en aurai plusieurs, et j'aurai si mes comptes sont exacts : 34 input/textarea a afficher selon le choix choisis dans laliste déroulante' 

    J'espere avoir réussi à être clair :)

    pouvez vous m'aider svp 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Document sans nom</title>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" /></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $('.champ1').hide(); // on cache les champ par défaut
        $('.champ2').hide();
    	$('.champ3').hide();
    	$('.champ4').hide();
    	$('.champ5').hide();
    	$('.champ6').hide(); 
    	$('.champ7').hide();
    	$('.champ8').hide();
    	$('.champ9').hide();
    	$('.champ10').hide(); 
        $('.champ11').hide();
        $('.champ12').hide();
    	$('.champ13').hide();
    	$('.champ14').hide();
    	$('.champ15').hide();
    	$('.champ16').hide(); 
    	$('.champ17').hide();
    	$('.champ18').hide();
    	$('.champ19').hide();
    	$('.champ20').hide();
        $('.champ21').hide(); 
        $('.champ22').hide();
    	$('.champ23').hide();
    	$('.champ24').hide();
    	$('.champ25').hide();
    	$('.champ26').hide(); 
    	$('.champ27').hide();
    	$('.champ28').hide();
        $('.champ29').hide(); 
        $('.champ30').hide();
    	$('.champ31').hide();
    	$('.champ32').hide();
    	$('.champ33').hide();
    	$('.champ34').hide();  
    	
    $('select[name="tpl"]').change(function() { // lorsqu'on change de valeur dans la liste
    var valeur = $(this).val(); // valeur sélectionnée
         
    if(valeur != '') { // si non vclasse
    	if(valeur == 'big') { // si "bigtxt"
    		$('.champ1').show();
    		$('.champ2').hide();
    		$('.champ3').hide();
    		$('.champ4').hide();
    		$('.champ5').hide();
    		$('.champ6').hide(); 
    		$('.champ7').hide();
    		$('.champ8').hide();
    		$('.champ9').hide();
    		$('.champ10').hide(); 
    		$('.champ11').hide();
    		$('.champ12').hide();
    		$('.champ13').hide();
    		$('.champ14').hide();
    		$('.champ15').hide();
    		$('.champ16').hide(); 
    		$('.champ17').hide();
    		$('.champ18').hide();
    		$('.champ19').hide();
    		$('.champ20').hide();
    		$('.champ21').hide(); 
    		$('.champ22').hide();
    		$('.champ23').hide();
    		$('.champ24').hide();
    		$('.champ25').hide();
    		$('.champ26').hide(); 
    		$('.champ27').hide();
    		$('.champ28').hide();
    		$('.champ29').hide(); 
    		$('.champ30').hide();
    		$('.champ31').hide();
    		$('.champ32').hide();
    		$('.champ33').hide();
    		$('.champ34').hide(); 	} 
    	else if(valeur == 'duo') { // si "duo"
    		$('.champ1').show();
    		$('.champ2').show();
    		$('.champ3').hide();
    		$('.champ4').hide();
    		$('.champ5').hide();
    		$('.champ6').hide(); 
    		$('.champ7').hide();
    		$('.champ8').hide();
    		$('.champ9').hide();
    		$('.champ10').hide(); 
    		$('.champ11').hide();
    		$('.champ12').hide();
    		$('.champ13').hide();
    		$('.champ14').hide();
    		$('.champ15').hide();
    		$('.champ16').hide(); 
    		$('.champ17').hide();
    		$('.champ18').hide();
    		$('.champ19').hide();
    		$('.champ20').hide();
    		$('.champ21').hide(); 
    		$('.champ22').hide();
    		$('.champ23').hide();
    		$('.champ24').hide();
    		$('.champ25').hide();
    		$('.champ26').hide(); 
    		$('.champ27').hide();
    		$('.champ28').hide();
    		$('.champ29').hide(); 
    		$('.champ30').hide();
    		$('.champ31').hide();
    		$('.champ32').hide();
    		$('.champ33').hide();
    		$('.champ34').hide(); 	}
    	else {
    		$('.champ1').hide(); 
    		$('.champ2').hide();
    		$('.champ3').hide();
    		$('.champ4').hide();
    		$('.champ5').hide();
    		$('.champ6').hide(); 
    		$('.champ7').hide();
    		$('.champ8').hide();
    		$('.champ9').hide();
    		$('.champ10').hide(); 
    		$('.champ11').hide();
    		$('.champ12').hide();
    		$('.champ13').hide();
    		$('.champ14').hide();
    		$('.champ15').hide();
    		$('.champ16').hide(); 
    		$('.champ17').hide();
    		$('.champ18').hide();
    		$('.champ19').hide();
    		$('.champ20').hide();
    		$('.champ21').hide(); 
    		$('.champ22').hide();
    		$('.champ23').hide();
    		$('.champ24').hide();
    		$('.champ25').hide();
    		$('.champ26').hide(); 
    		$('.champ27').hide();
    		$('.champ28').hide();
    		$('.champ29').hide(); 
    		$('.champ30').hide();
    		$('.champ31').hide();
    		$('.champ32').hide();
    		$('.champ33').hide();
    		$('.champ34').hide(); 	}
    }
    });
    });
    </script>
    </head>
    
    <body>
    <form action="" method="post" name="addbloc">
    <p>
        <select name="tpl" id="tpl">
            <option value="">-- Choisir votre type de bloc --</option>
            <option value="big">bigtxt</option>
            <option value="duo">duotxt</option>
        </select><br />
        <span class="label champ1">Key</span><br/><input type="text" class="champ1" /><br />
        <span class="label champ2">Entreprise</span><br/><textarea class="champ2" /></textarea><br />
        <span class="label champ3">Entreprise</span><br/><input type="text" class="champ3" /><br />
        <span class="label champ4">Entreprise</span><br/><input type="text" class="champ4" /><br />
        <span class="label champ5">Entreprise</span><br/><input type="text" class="champ5" /><br />
        <span class="label champ6">Entreprise</span><br/><input type="text" class="champ6" /><br />
    	<span class="label champ7">Entreprise</span><br/><input type="text" class="champ7" /><br />
        <span class="label champ8">Entreprise</span><br/><input type="text" class="champ8" /><br />
        <span class="label champ9">Entreprise</span><br/><input type="text" class="champ9" /><br />
        <span class="label champ10">Entreprise</span><br/><input type="text" class="champ10" /><br />
        <span class="label champ11">Entreprise</span><br/><input type="text" class="champ11" /><br />
        <span class="label champ12">Entreprise</span><br/><input type="text" class="champ12" /><br />
    	<span class="label champ13">Entreprise</span><br/><input type="text" class="champ13" /><br />
        <span class="label champ14">Entreprise</span><br/><input type="text" class="champ14" /><br />
        <span class="label champ15">Entreprise</span><br/><input type="text" class="champ15" /><br />
        <span class="label champ16">Entreprise</span><br/><input type="text" class="champ16" /><br />
        <span class="label champ17">Entreprise</span><br/><input type="text" class="champ17" /><br />
        <span class="label champ18">Entreprise</span><br/><input type="text" class="champ18" /><br />
        <span class="label champ19">Entreprise</span><br/><input type="text" class="champ19" /><br />
        <span class="label champ20">Entreprise</span><br/><input type="text" class="champ20" /><br />
        <span class="label champ21">Entreprise</span><br/><input type="text" class="champ21" /><br />
        <span class="label champ22">Entreprise</span><br/><input type="text" class="champ22" /><br />
        <span class="label champ23">Entreprise</span><br/><input type="text" class="champ23" /><br />
        <span class="label champ24">Entreprise</span><br/><input type="text" class="champ24" /><br />
        <span class="label champ25">Entreprise</span><br/><input type="text" class="champ25" /><br />
        <span class="label champ26">Entreprise</span><br/><input type="text" class="champ26" /><br />
        <span class="label champ27">Entreprise</span><br/><input type="text" class="champ27" /><br />  
        <span class="label champ28">Entreprise</span><br/><input type="text" class="champ28" /><br /> 
        <span class="label champ29">Entreprise</span><br/><input type="text" class="champ29" /><br /> 
        <span class="label champ30">Entreprise</span><br/><input type="text" class="champ30" /><br /> 
        <span class="label champ31">Entreprise</span><br/><input type="text" class="champ31" /><br /> 
        <span class="label champ32">Entreprise</span><br/><input type="text" class="champ32" /><br /> 
        <span class="label champ33">Entreprise</span><br/><input type="text" class="champ33" /><br />
        <span class="label champ34">Entreprise</span><br/><input type="text" class="champ34" /><br />
    </p>
    <div style="z-index:99;"><input type="submit" name="Submit" value="AJOUTER BLOC" class="bouton"></div>
    </form>
    </body>
    </html>
    



    • Partager sur Facebook
    • Partager sur Twitter
      21 février 2018 à 13:52:31

      Yop,

      hmmmm j'ai peur de pas avoir compris ton problème mais en gros en cliquant sur par exemple duo tu voudrais que 1 des 34 champs apparaissent ?

      PS : je vais te donner des astuces pour que ton code soit un peu plus simple

      • Partager sur Facebook
      • Partager sur Twitter
        21 février 2018 à 13:56:11

        Re alors mon problème est que j'ai pas caché les <br/> .... pff  du coup j'ai corrigé mon problème tout seul :D

        sinon en fait je veux pouvoir afficher ou masquer des input selon mon choix dans la liste deroulante 

        par exemple  le choix duo aura 2 input mais le choix "toto" lui en aura 5 différents .... le nombres d'input variera donc selon le choix fait précédemment dans la liste déroulante

        Mais si tu as des astuces pour alléger ou simplifier le code je prends

        je te remet le code corrigé

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
            <title>Document sans nom</title>
            <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"/>
            </script>
            <script type = "text/javascript" >
                $(document).ready(function () {
                    $('.champ1').hide(); // on cache les champ par défaut
                    $('.champ2').hide();
                    $('.champ3').hide();
                    $('.champ4').hide();
                    $('.champ5').hide();
                    $('.champ6').hide();
                    $('.champ7').hide();
                    $('.champ8').hide();
                    $('.champ9').hide();
                    $('.champ10').hide();
                    $('.champ11').hide();
                    $('.champ12').hide();
                    $('.champ13').hide();
                    $('.champ14').hide();
                    $('.champ15').hide();
                    $('.champ16').hide();
                    $('.champ17').hide();
                    $('.champ18').hide();
                    $('.champ19').hide();
                    $('.champ20').hide();
                    $('.champ21').hide();
                    $('.champ22').hide();
                    $('.champ23').hide();
                    $('.champ24').hide();
                    $('.champ25').hide();
                    $('.champ26').hide();
                    $('.champ27').hide();
                    $('.champ28').hide();
                    $('.champ29').hide();
                    $('.champ30').hide();
                    $('.champ31').hide();
                    $('.champ32').hide();
                    $('.champ33').hide();
                    $('.champ34').hide();
        
                    $('select[name="tpl"]').change(function () { // lorsqu'on change de valeur dans la liste
                        var valeur = $(this).val(); // valeur sélectionnée
        
                        if (valeur != '') { // si non si non vide
                            if (valeur == 'big') { // si "big"
                                $('.champ1').show();
                                $('.champ2').hide();
                                $('.champ3').hide();
                                $('.champ4').hide();
                                $('.champ5').hide();
                                $('.champ6').hide();
                                $('.champ7').hide();
                                $('.champ8').hide();
                                $('.champ9').hide();
                                $('.champ10').hide();
                                $('.champ11').hide();
                                $('.champ12').hide();
                                $('.champ13').hide();
                                $('.champ14').hide();
                                $('.champ15').hide();
                                $('.champ16').hide();
                                $('.champ17').hide();
                                $('.champ18').hide();
                                $('.champ19').hide();
                                $('.champ20').hide();
                                $('.champ21').hide();
                                $('.champ22').hide();
                                $('.champ23').hide();
                                $('.champ24').hide();
                                $('.champ25').hide();
                                $('.champ26').hide();
                                $('.champ27').hide();
                                $('.champ28').hide();
                                $('.champ29').hide();
                                $('.champ30').hide();
                                $('.champ31').hide();
                                $('.champ32').hide();
                                $('.champ33').hide();
                                $('.champ34').hide();
                            }
                            else if (valeur == 'duo') { // si "duo"
                                $('.champ1').show();
                                $('.champ2').show();
                                $('.champ3').hide();
                                $('.champ4').hide();
                                $('.champ5').hide();
                                $('.champ6').hide();
                                $('.champ7').hide();
                                $('.champ8').hide();
                                $('.champ9').hide();
                                $('.champ10').hide();
                                $('.champ11').hide();
                                $('.champ12').hide();
                                $('.champ13').hide();
                                $('.champ14').hide();
                                $('.champ15').hide();
                                $('.champ16').hide();
                                $('.champ17').hide();
                                $('.champ18').hide();
                                $('.champ19').hide();
                                $('.champ20').hide();
                                $('.champ21').hide();
                                $('.champ22').hide();
                                $('.champ23').hide();
                                $('.champ24').hide();
                                $('.champ25').hide();
                                $('.champ26').hide();
                                $('.champ27').hide();
                                $('.champ28').hide();
                                $('.champ29').hide();
                                $('.champ30').hide();
                                $('.champ31').hide();
                                $('.champ32').hide();
                                $('.champ33').hide();
                                $('.champ34').hide();
                            }
        					else if (valeur == 'trio') { // si "trio"
                                $('.champ1').show();
                                $('.champ2').show();
                                $('.champ3').show();
                                $('.champ4').show();
                                $('.champ5').show();
                                $('.champ6').show();
                                $('.champ7').show();
                                $('.champ8').hide();
                                $('.champ9').hide();
                                $('.champ10').hide();
                                $('.champ11').hide();
                                $('.champ12').show();
                                $('.champ13').hide();
                                $('.champ14').hide();
                                $('.champ15').hide();
                                $('.champ16').show();
                                $('.champ17').hide();
                                $('.champ18').hide();
                                $('.champ19').hide();
                                $('.champ20').hide();
                                $('.champ21').hide();
                                $('.champ22').show();
                                $('.champ23').hide();
                                $('.champ24').hide();
                                $('.champ25').hide();
                                $('.champ26').hide();
                                $('.champ27').hide();
                                $('.champ28').hide();
                                $('.champ29').hide();
                                $('.champ30').hide();
                                $('.champ31').hide();
                                $('.champ32').hide();
                                $('.champ33').hide();
                                $('.champ34').hide();
                            }
                            else {
                                $('.champ1').hide();
                                $('.champ2').hide();
                                $('.champ3').hide();
                                $('.champ4').hide();
                                $('.champ5').hide();
                                $('.champ6').hide();
                                $('.champ7').hide();
                                $('.champ8').hide();
                                $('.champ9').hide();
                                $('.champ10').hide();
                                $('.champ11').hide();
                                $('.champ12').hide();
                                $('.champ13').hide();
                                $('.champ14').hide();
                                $('.champ15').hide();
                                $('.champ16').hide();
                                $('.champ17').hide();
                                $('.champ18').hide();
                                $('.champ19').hide();
                                $('.champ20').hide();
                                $('.champ21').hide();
                                $('.champ22').hide();
                                $('.champ23').hide();
                                $('.champ24').hide();
                                $('.champ25').hide();
                                $('.champ26').hide();
                                $('.champ27').hide();
                                $('.champ28').hide();
                                $('.champ29').hide();
                                $('.champ30').hide();
                                $('.champ31').hide();
                                $('.champ32').hide();
                                $('.champ33').hide();
                                $('.champ34').hide();
                            }
                        }
                    });
                });
            </script>
        </head>
        
        <body>
        <form action="" method="post" name="addbloc">
            <p>
                <select name="tpl" id="tpl">
                    <option value="">-- Choisir votre type de bloc --</option>
                    <option value="big">big</option>
                    <option value="duo">duo</option>
                    <option value="trio">trio</option>
                </select><br/>
            <div style="padding-top:10px;" class="champ1">
                <span class="label">Key</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ2">
                <span class="label">Entreprise</span><br/><textarea/></textarea><br/>
            </div>
            <div style="padding-top:10px;" class="champ3">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ4">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ5">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ6">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ7">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ8">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ9">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ10">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ11">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ12">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ13">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ14">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ15">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ16">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ17">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ18">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ19">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ20">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ21">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ22">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ23">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ24">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ25">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ26">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ27">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ28">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ29">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ30">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ31">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ32">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ33">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            <div style="padding-top:10px;" class="champ34">
                <span class="label">Entreprise</span><br/><input type="text"/>
            </div>
            </p>
            <div style="z-index:99;"><input type="submit" name="Submit" value="AJOUTER BLOC" class="bouton"></div>
        </form>
        </body>
        </html>
        

        -
        Edité par ZeroCool5 21 février 2018 à 14:11:30

        • Partager sur Facebook
        • Partager sur Twitter
          21 février 2018 à 14:32:56

          hmmm,

          Bon en gros j'ai fait mon propre truc avec le max de simplification que j'ai pu (je te les expliques juste apres le code ;)

          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          <html xmlns="http://www.w3.org/1999/xhtml">
          	<head>
          	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
          	<title>Document sans nom</title>
          	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" /></script>
          	<script type="text/javascript">
          		$(document).ready(function() {
          		    $('.champ').hide(); // on cache les champ par défaut
          		     
          			$('select[name="tpl"]').change(function() { // lorsqu'on change de valeur dans la liste
          				$('.champ').hide();
          				var truc = $(this).find('option:selected').attr('data-id');
          				$(truc).show();
          			});
          		});
          	</script>
          	</head>
           
          	<body>
          		<form action="" method="post" name="addbloc">
          		<p>
          		    <select name="tpl" id="tpl">
          		        <option value="">-- Choisir votre type de bloc --</option>
          		        <option value="big" data-id='#champ3,#champ5'>bigtxt</option>
          		        <option value="duo" data-id='#champ7,#champ2'>duotxt</option>
          		    </select><br />
          			    <div class="label champ" id="champ1">Key<br/><input type="text" /><br /></div>
          			    <div class="label champ" id="champ2">Entreprise<br/><textarea /></textarea><br /></div>
          			    <div class="label champ" id="champ3">Entreprise<br/><input type="text"/><br /></div>
          			    <div class="label champ" id="champ4">Entreprise<br/><input type="text"/><br /></div>
          			    <div class="label champ" id="champ5">Entreprise<br/><input type="text"/><br /></div>
          			    <div class="label champ" id="champ6">Entreprise<br/><input type="text"/><br /></div>
          			    <div class="label champ" id="champ7">Entreprise<br/><input type="text"/><br /></div>
          			    <div class="label champ" id="champ8">Entreprise<br/><input type="text"/><br /></div>
          		</p>
          		<div style="z-index:99;"><input type="submit" name="Submit" value="AJOUTER BLOC" class="bouton"></div>
          		</form>
          	</body>
          </html>



          j'ai fusionné tes id et span

          Ensuite j'ai changer tes classe="champ1" etc en id="champ1" : le principe de la classe c'est qu'elle est peut être attribué a plusieurs élément alors que l'id lui a un seul. En gros la classe sert a manipuler un ensemble d’élément alors que l'id lui vise un élément précis.

          J'ai aussi modifié tes classes pour quelle ai la classe champ

          Grâce à cette classe champ j'ai pu toute les modifier d'un coup au lieu de faire

          $('.champ1').hide(); etc

          Et pour finir j'ai simplifier le code pour que les boutons que tu veuille afficher soit compris dans le data-id que j'ai rajouter sur tes options ;)

          (et comme sa me soulait tous ces entré j'en ai laissé que 7 mais bon sa tu peux en mettre autant que tu veux) ;)

          Hésite pas a demander si tu as d'autre questions ^^



          -
          Edité par Sanapag 21 février 2018 à 14:34:13

          • Partager sur Facebook
          • Partager sur Twitter
            21 février 2018 à 14:44:13

            Merci beaucoup, je vais regarder tout ca, des que j'ai un peu le temps

            Merci pour ton temps 

            EDIT : J'ai pas pu résister... je viens de regarder ... GÉNIAL !!! tu est un chef. milles mercis

            -
            Edité par ZeroCool5 21 février 2018 à 14:47:43

            • Partager sur Facebook
            • Partager sur Twitter
              21 février 2018 à 14:57:55

              De rien, oublie pas de passer le sujet en résolu ;)
              • Partager sur Facebook
              • Partager sur Twitter

              Afficher des champs selon le liste deroulante

              × 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