Page 1 sur 1

ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT

Posté : 03 janv. 2023, 11:22
par bedson
Bonjour à tous,
J'espère que vous allez bien.

J'ai un formulaire contenant deux champs input type text et un bouton valider.
Le champ (contact1) comporte un numéro de téléphone sur 10 positions.
Le champ (contact2) est un champ vide

Le bouton est désactivé par défaut .
Je souhaite que le bouton soit actif dès que le numéro de téléphone entré dans le champ 2 est différent de celui du champ 1.
J'ai besoin de votre aide svp !!!

<script>
$( document ).ready(function() {
var contact1 = $('#contact1').val();
$('#contact2').keyup(function(e){
if( contact1 == this.value )
{
$('#btn-submit').prop('disabled', false);
}else{
$('#btn-submit').prop('disabled', true);
}
})
});
</script>

Re: ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT

Posté : 04 janv. 2023, 12:33
par webmaster
Bonjour

Il me faudrait le code du formulaire également pour faire plus d'essais

Re: ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT

Posté : 04 janv. 2023, 14:55
par bedson
Bonjour Webmaster,

Tu trouveras ci-dessous le code:

<html>
<head>
<title>Test Bede</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@ ... ap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

</head>
<body>
<div class="container">
<h1>Hello, world!</h1>
<div class="row">
<div class="col-md-6">
<div class="mb-3">
<label for="contact1" class="form-label">Contact 1</label>
<input type="text" class="form-control" id="contact1" placeholder="" value="0708509433" disabled>
</div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label for="contact2" class="form-label">Contact 2</label>
<input type="text" class="form-control" id="contact2" placeholder="">
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<button class="btn btn-primary btn-block" id="btn-submit" disabled="true"> Enregistrer</button>
</div>
</div>
</div>

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@ ... per.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@ ... rap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>

<script>
$( document ).ready(function() {
var contact1 = $('#contact1').val();
$('#contact2').keyup(function(e){
if( contact1 == this.value )
{
$('#btn-submit').prop('disabled', false);
}else{
$('#btn-submit').prop('disabled', true);
}
})
});
</script>
</body>
</html>

Re: ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT

Posté : 05 janv. 2023, 10:00
par webmaster
Bonjour

Après quelques essais, je suis arrivé à cette fonction :

Code : Tout sélectionner

$( document ).ready(function() {
    var contact1 = $('#contact1').val();
    $('#contact2').keyup(function(e){
        console.log("contact2 :"+this.value)
        if( contact1 == this.value )  {
            $('#btn-submit').removeAttr('disabled');
        }else{
            $('#btn-submit').attr('disabled', true);
        }
    })
});
j'ai utilisé removeAttr() car disabled='false' laisse le bouton desactivé