2 selectbox qui updatent un textfield Fermé

Question

Bonjour,

je dois mettre en place un formulaire avec 2 selectbox comportant des value, si 2 selectionnée => cela doit m'updater un textfiel avec la bonne grille et le bonne association

j'ai réussi a updater un textfield avec un select en chinant sur le web, mais pour les deux j'ai un peu de soucis

$("#inputMontant").css({ opacity: 0.5 }); 
     $('#inputPersonnes').change(function() {
             
	 if($(this).find('option:selected').val() == "Seul"){
          $('#inputMontant').fadeTo("slow", 1);
		  
            } else{
          $("#inputMontant").css({ opacity: 0.5 }); 
              }
            });
     
	 $("#inputMontant").keyup(function(ev){
                  var othersOption = $('#inputMontant').find('option:selected');
                  if(othersOption.val() == "Other"){
                    ev.preventDefault();
                    //change the selected drop down text
                    $(othersOption).html($("#inputMontant").val()); 


                  } 
            });

 <select name="inputPersonnes" id="inputPersonnes" >
            <option >---Sélectionnez---</option>
            <option value="20.00">Moi</option>
            <option value="30.00">Mon couple</option>
            <option value="40.00">Ma famille</option>
          </select>

<select name="inputCotisation" id="inputCotisation"  >
            <option >---Sélectionnez---</option>
            <option value="50.00">50 €</option>
            <option value="75.00">75 €</option>
            <option value="100.00">100 €</option>
          </select>

<input type="text" id="inputMontant" name="inputMontant" placeholder="calcul de votre cotisation"  readonly="readonly">

j'ai un peu du mal a lier le tout
si select 1 : value selected = 20.00 par exemple
Si select 2 : value selected = 50.00

Alors si les deux selectionnez j'ai fadin sur mon textfiel et j'ai l'adition
je suis pas tres familiarisé avec le javascript
Merci d'avance !

ubik74 · Answer

$("#inputCotisation").css({ opacity: 0.3 });
	$("#inputMontant").css({ opacity: 0.3 }); 
   
    $('#inputPersonnes').change(function() {      
	 if($(this).find('option:selected').val() == "0" ){
         $("#inputCotisation").css({ opacity: 0.3 });
		 
		  if($(this).find('option:selected').val() == "Seul" ){ var Montant1 = "1"; };
		  if($(this).find('option:selected').val() == "Couple" ){ var Montant1 = "2"; };
		  if($(this).find('option:selected').val() == "Famille" ){ var Montant1 = "3"; };
		 
          } 
		  
		  else{ $('#inputCotisation').fadeTo("slow", 1);
		  $("#inputCotisation").css({ opacity: 0.3 });
              }
            });

	$('#inputCotisation').change(function() {      
	 if($(this).find('option:selected').val()  == "0" ){
		     $("#inputMontant").css({ opacity: 0.3 });
           
		  if($(this).find('option:selected').val() == "Niveau 1" && Montant1 == "1" ){ var Montant2 = "5,45 €"; };
		  if($(this).find('option:selected').val() == "Niveau 1" && Montant1 == "2" ){ var Montant2 = "8,73 €"; };
		  if($(this).find('option:selected').val() == "Niveau 1" && Montant1 == "3" ){ var Montant2 = "10,91 €"; };
		  if($(this).find('option:selected').val() == "Niveau 2" && Montant1 == "1" ){ var Montant2 = "6,25 €"; };
		  if($(this).find('option:selected').val() == "Niveau 2" && Montant1 == "2" ){ var Montant2 = "10,25 €"; };
		  if($(this).find('option:selected').val() == "Niveau 2" && Montant1 == "3" ){ var Montant2 = "12,91 €"; };
		  if($(this).find('option:selected').val() == "Niveau 3" && Montant1 == "1" ){ var Montant2 = "7,05 €"; };
		  if($(this).find('option:selected').val() == "Niveau 3" && Montant1 == "2" ){ var Montant2 = "11,76 €"; };
		  if($(this).find('option:selected').val() == "Niveau 3" && Montant1 == "3" ){ var Montant2 = "14,91 €"; };
		  
		    } else{
				 $('#inputMontant').fadeTo("slow", 1);
              }
            });

	 $("#inputMontant").keyup(function(ev){
                  var Montant = $('#inputMontant').find('option:selected');
                  if(Montant.val() == "Seul"){
                    ev.preventDefault();
                    //change the selected drop down text
                    $(inputMontant).html($("#inputMontant").val('5,45 €')); 


                  } 
            }); <input type="text" id="inputMontant" name="inputMontant" placeholder="calcul de votre cotisation"  readonly="readonly">

J'ai optimisé ma fonction
La si on selectionne 1er select ca affiche le second
Si on selectionne le second ca affiche le textfield
Je fais comment du coup pour reccupérer Montant deux comme valeur et pour l'afficher dans le textfield, c'est ma derniere fonction qui beug

2 selectbox qui updatent un textfield

1 réponse

Discussions similaires