Partage
  • Partager sur Facebook
  • Partager sur Twitter

Initialisé un formulaire en fonction d'un radio

    19 juin 2019 à 16:52:02

    hello j'ai un petit soucis de code jquery ...

    j'ai un formulaire avec plein de champ le tout piloté via un champ radio

    1 si il n'y a rien de choisis alors on affiche cache des champs (initialisation)

    2 si on selectionne un champ cela affiche cache des champs (onchange)

    3 si on recharge un formulaire il affiche les champs en fonction de la valeur du champ bouton principal(check)

    La partie 2-3 fonctionne nikel mais je ne comprend pas comment faire la partie 1

    ( function($) {
    $(document).ready(function() {
    
    $('input:radio[name="custom[type-de-fiche-annuaire][0]"]:checked').each(function() {
       var valeurInit = $(this).val(); // valeur sélectionnée au chargement de la page
    console.log(valeurInit);
    
    if(valeurInit === '') {
    // ici on affiche le formulaire au chargement si rien n'est checker
    }
    else if(valeurInit == 'administration') {// si la valeur vaut administration
    } 
    else if (valeurInit == 'sante') { // si si la valeur vaut sante
    }
    });
        $('input:radio[name="custom[type-de-fiche-annuaire][0]"]').change(function() { // lorsqu'on change de valeur dans la liste
        var valeur = $(this).val(); // valeur sélectionnée au click
    //alert($(this).val());
    
    
    if(valeur != '') { // si non vide
    } 
    else if (valeur == 'sante') { // si la valeur est changée pour sante
    }
    else if (valeur == 'etascolaire') { // si la valeur est changée pour etablissement scolaire
    }else{
    }
        });
     
    });
    } ) ( jQuery );

    le consol log ne revoit des infos que quand je change ou que je charge un formulaire ayant déjà une valeur  ....

    console.log(valeurInit);
    
    j'ai l'impression que mon check
    if(valeurInit === '') {
    n'ai pas bon mais je n'arrive pas a trouvé la bonne approche ...
    je suis débutant en js je bidouille beaucoup donc désolé par avance pour l'horreur du code
    lol
    Merci par avance pour votre aide

    -
    Edité par micker 19 juin 2019 à 16:52:27

    • Partager sur Facebook
    • Partager sur Twitter
      19 juin 2019 à 17:51:58

      Bonjour,

      tu ne fais aucun test pour voir si il y a rien de ckecké, pour passer dans ton if qui test si la valeur est vide, il faut que l'input soit checké.

      Si tu as des groupes d'inputs (plusieurs inputs avec le même attribut name), tu peux faire quelque chose du genre : https://codepen.io/anon/pen/MMbmoV?&editable=true

      De manière générale, === c'est mieux que ==.

      • Partager sur Facebook
      • Partager sur Twitter
        19 juin 2019 à 21:12:45

        desoler je ne comprend ton exemple exemple ...

        j'ai essayer de faire un 

        $('valeurInit').is(':checked'){

        .. mais pareil

        • Partager sur Facebook
        • Partager sur Twitter
          20 juin 2019 à 13:10:58

          Dans l'exemple, tous les inputs ont la même valeur pour l'attribut name, et ils sont tous dans un formulaire. Pour savoir quel est l'input sélectionné, il suffit de sélectionner le formulaire, et de profiter de la hashtable qu'il contient : form.inputName = valueInputChecke. En plus, au lieu de mettre un évènement sur tous les inputs, tu peux mettre un évènement sur le formulaire.

          -
          Edité par piero5673 20 juin 2019 à 13:13:31

          • Partager sur Facebook
          • Partager sur Twitter
            20 juin 2019 à 14:41:06

            ok voici mon element

            <div id="container_fcfield_98">
                <div><input type="radio" id="custom_type-de-fiche-annuaire_0_0" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck"><a href="#" class=" "></a>
            <label for="custom_type-de-fiche-annuaire_0_0"> Administration</label><input type="radio" id="custom_type-de-fiche-annuaire_0_1" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="sante" style="display: none;">
            <label for="custom_type-de-fiche-annuaire_0_1"> Santé</label><input type="radio" id="custom_type-de-fiche-annuaire_0_2" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="assmat" style="display: none;">	
                 </div>			
            </div>



            • Partager sur Facebook
            • Partager sur Twitter
              20 juin 2019 à 15:04:05

              Je vois 3 inputs, avec le même nom, comme dans l'exemple, mais pas de formulaire. Pourtant c'est bien les formulaires. Si tu veux faire un formulaire sans formulaire, il faut tout recoder à la main. Ca veut dire qu'il faut que tu aille sélectionner tous tes inputs et vérifier si chaque input est checké ou non.
              • Partager sur Facebook
              • Partager sur Twitter
                21 juin 2019 à 9:14:07

                hello voici ma version light avec le formulaire

                <form action="" method="post" name="adminForm" id="adminForm" class="form-validate form-horizontal" enctype="multipart/form-data">
                		
                	....			
                						<div id="custom_type-de-fiche-annuaire_0" class="fc_input_set has-pretty-child">
                							 <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_0" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="administration" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_0"> Administration</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_1" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="sante" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_1"> Santé</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_2" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="assmat" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_2"> Assistante maternelle</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_3" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="etascolaire" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_3"> Etablissement scolaire</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_4" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="alaealsh" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_4"> ALAE / ALSH</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_5" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="association" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_5"> Association</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_6" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="acteureconomique" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_6"> Acteur économique</label></div>&nbsp; <div class="clearfix prettyradio labelright fcradiocheck blue"><input type="radio" id="custom_type-de-fiche-annuaire_0_7" data-element-grpid="custom_type-de-fiche-annuaire_0" name="custom[type-de-fiche-annuaire][0]" data-customclass="fcradiocheck" class="use_prettycheckable custom_type-de-fiche-annuaire_0" value="equipement" style="display: none;"><a href="#" class=" "></a>
                <label for="custom_type-de-fiche-annuaire_0_7"> Equipement</label></div>
                							
                						</div>					
                			....
                			
                				<button class="btn btn-success" type="button" onclick="return flexi_submit('save', 'flexi_form_submit_btns', 'flexi_form_submit_msg');">
                					<span class="fcbutton_save">Ajouter et quitter</span>
                				</button>
                			
                						
                			<button class="btn" type="button" onclick="return flexi_submit('cancel', 'flexi_form_submit_btns', 'flexi_form_submit_msg')">
                				<span class="fcbutton_cancel">Annuler</span>
                			</button>
                			
                		</div>
                						
                		<br class="clear">
                		<input type="hidden" name="c312dd98d5a1c677d942c10848574472" value="1">		<input type="hidden" name="task" id="task" value="">
                		<input type="hidden" name="option" value="com_flexicontent">
                		<input type="hidden" name="referer" value="...">
                					<input type="hidden" name="jform[type_id]" value="6">
                				<input type="hidden" name="jform[id]" id="jform_id" value="0" class="readonly">		
                				<input type="hidden" name="jform[submit_conf]" value="cd6b3ddb2f933c48e535751662116ae9">		
                		<input type="hidden" name="unique_tmp_itemid" value="_2019_06_21_09_09_00_15d0c828cc5d0e">
                
                	</form>



                • Partager sur Facebook
                • Partager sur Twitter

                Initialisé un formulaire en fonction d'un radio

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                • Editeur
                • Markdown