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>
ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT
ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT
- Fichiers joints
-
- Capture.JPG (25.41 Kio) Vu 2714 fois
Re: ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT
Bonjour
Il me faudrait le code du formulaire également pour faire plus d'essais
Il me faudrait le code du formulaire également pour faire plus d'essais
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php
Re: ACTIVER LE BUTON ENREGISTRER EN JAVASCRIPT
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>
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
Bonjour
Après quelques essais, je suis arrivé à cette fonction :
j'ai utilisé removeAttr() car disabled='false' laisse le bouton desactivé
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);
}
})
});
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php
https://www.toutjavascript.com/livre/index.php