Vérifier que l'IBAN rentré est correct puis afficher le BIC [Résolu]

Signaler
Messages postés
65
Date d'inscription
samedi 9 février 2019
Statut
Membre
Dernière intervention
29 avril 2020
-
Messages postés
65
Date d'inscription
samedi 9 février 2019
Statut
Membre
Dernière intervention
29 avril 2020
-
Bonjour tout le monde, je suis un débutants en JavaScript.
Je souhaite vérifier que l'IBAN rentré est correct grâce à openiban.com puis afficher le BIC correspondant dans le même formulaire.
Sur le site il est dit "openiban.com autorise l'accès interdomaines. Vous pouvez facilement ajouter la validation à votre propre site en utilisant l'extrait de code JavaScript suivant"
$.ajax({
 url: 'https://openiban.com/validate/DE89370400440532013000', // replace with
        // dynamic value
 data: { // pass additional options
  "validateBankCode": true,  // (not guaranteed)
  "getBIC": true    // (not guaranteed)
 },
 success: function(data) {
  var result = data;
  if(result.valid) {
   // YOUR LOGIC
   //
  }
 },
 error: function(xhr) {
  // handle error
 }
});

Comment puis-je intégrer ce code à ma page?
Après avoir entré l'IBAN, lorsque l'utilisateur clique sur BIC, le code BIC devrait apparaître(j'ai mis ce champ en readonly). J'ai besoin d'aide svp.

Voici mon code:
<html lang="fr">
<head>
 <meta charset="utf-8">
    <title>openiban</title>
</head>
 <body>
  <form action="" method="post" class="form-horizontal">

                <div class="form-group form-group-iban-input">
                 <label class="col-sm-1 control-label">IBAN</label>
                 <div class="col-sm-8">
                   <input class="form-control" id="iban_input" type="text" name="iban" />
                  </div>


                 <div class="form-group form-group-iban-input">
                  <label class="col-sm-1 control-label">BIC</label> 
                  <div class="col-sm-11">
                   <input id="bic_result_container" readonly type="text" rows="5" "></input>
                  </div>
                 </div>

                
  </form>
     
     <script type="text/javascript" src="js/goiban.js"></script>
 </body>


</html>

3 réponses

Messages postés
29782
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
20 octobre 2020
2 862
Bonjour
Comme indiqué

replace with dynamic value


Pour ca tu dois placer ce code dans une fonction
Faire appel à cette fonction une fois la saisie faite (via un onblur par exemple)

Ne pas oublier d'inclure la librairie jquery pour que ça marche.

Messages postés
65
Date d'inscription
samedi 9 février 2019
Statut
Membre
Dernière intervention
29 avril 2020

Bonjour, je vous remercie pour votre réponse.
J'ai fait un peu de recherche sur Google mais sans succès, j'ai vraiment du mal à me familiariser avec JavaScript.
"Ne pas oublier d'inclure la librairie jquery pour que ça marche" Parlez-vous du fichier goiban.js?
Est-ce possible de tout mettre sur la même page? Si Oui comment le faire, j'ai du mal à m'en sortir.
replace with dynamic value
Comment faire pour récupérer l'IBAN entré.
Merci
Messages postés
65
Date d'inscription
samedi 9 février 2019
Statut
Membre
Dernière intervention
29 avril 2020

Quelqu'un pourrais m'aider svp?
Merci!
Messages postés
29782
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
20 octobre 2020
2 862
Je pensai que depuis hier tu avais pu avancer.
As tu cherché ce qu'était jquery et comment l'utiliser ? (https://www.w3schools.com/jquery/jquery_get_started.asp)
As tu cherché ce que sont les "event'" en javascript ? le onblur ? ( https://www.w3schools.com/jsref/event_onblur.asp) (https://api.jquery.com/blur/)
Comment écrire une fonction en JS ? (https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Instructions/function)



Coté JS ça devrait ressembler à ça
$("#iban_input").on("blur",function(){
    var cherche = $(this).val();
	getBIC(cherche);

});

function getBIC(cherche){
	$.ajax({
	 url: 'https://openiban.com/validate/' + cherche, // replace with dynamic value
	 data: { // pass additional options
	  "validateBankCode": true,  // (not guaranteed)
	  "getBIC": true    // (not guaranteed)
	 },
	 success: function(result) {
	    if(typeof(result)!="undefined" && result!=null){
		  if(result.valid) {
			// Ici tu code l'utilisation du résultat...
			console.log(result);//permettra de voir ce que contient la variable result dans la console du navigateur.
			$("#bic_result_container").val(result.valid); 
		  }else{
			alert ("Résultat non valide");
		  }
	    } else{
		  alert ("No result");
		}
	 },
	 error: function(xhr) {
	  // handle error
	  alert("erreur Ajax");
	  console.log(xhr);
	 }
	});
}


et dans ton html (dans le head par exemple ), il faut ajouter ça :
<script  src="https://code.jquery.com/jquery-3.4.1.min.js"  
             integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="   
             crossorigin="anonymous">
</script>
Messages postés
65
Date d'inscription
samedi 9 février 2019
Statut
Membre
Dernière intervention
29 avril 2020

Merci beaucoup pour votre aide. Ça a marcher.
J'ai remplacer
$("#bic_result_container").val(result.valid);
par
$("#bic_result_container").val(result.bankData.bic);
le bic s'affiche correctement.