Vérifier que l'IBAN rentré est correct puis afficher le BIC

Résolu

ananias8686 Messages postés 96 Statut Membre -
ananias8686 Messages postés 96 Statut Membre - 6 avr. 2020 à 22:08

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>

Afficher la suite

3 réponses

Réponse 1 / 3
jordane45 Messages postés 30427 Date d'inscription Statut Modérateur Dernière intervention 4 832
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.
0
1. ananias8686 Messages postés 96 Statut Membre
  
  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
  
  0

ananias8686 Messages postés 96 Statut Membre

Quelqu'un pourrais m'aider svp?
Merci!

jordane45 Messages postés 30427 Date d'inscription Statut Modérateur Dernière intervention 4 832

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>

Réponse 3 / 3
ananias8686 Messages postés 96 Statut Membre
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.
0

Vérifier que l'IBAN rentré est correct puis afficher le BIC

3 réponses

Discussions similaires

Newsletters