9
votes

Comment puis-je désactiver le bouton Soumettre jusqu'à ce que le texte soit entré dans le champ de saisie?

J'ai un problème essayer d'atteindre ce résultat, à peu près ce dont j'ai besoin, c'est de désactiver le bouton Soumettre jusqu'à ce que le texte soit entré dans le champ de saisie. J'essaye certaines fonctions mais sans résultats.

MARKUP HTML P>

<form action="" method="get" id="recipename">
<input type="text" id="name" name="name" class="recipe-name" 
    value="Have a good name for it? Enter Here" 
    onfocus="if (this.value == 'Have a good name for it? Enter Here') {this.value = '';}" 
    onblur="if (this.value == '') {this.value = 'Have a good name for it? Enter Here';}" 
/>
<input type="submit" class="submit-name" value="" />
</form>

javascript jquery html css

0 commentaires

6 Réponses :

2
votes

Appelez une fonction JavaScript comme ci-dessous (donner l'exemple de jQuery) dans l'événement ONKECUP

function handleSubmit()
{
if($.trim($('#name').val() == ''))
{
$('.submit-name').attr('disabled','disabled');
}
else
{
$('.submit-name').attr('disabled','');
}
}

0 commentaires

1
votes

$("#textField").keyup(function() {
    var $submit = $(this).next(); // or $("#submitButton");
    if(this.value.length > 0 && this.value != "Default value") {
        $submit.attr("disabled", false);
    } else {
        $submit.attr("disabled", true);
    }
});

0 commentaires

7
votes

Vous pouvez utiliser ceci: xxx

voir dans jsfiddle . < / p>

1 commentaires

C'est la réponse que je cherchais, merci beaucoup pour votre aide.

1
votes

Vous pouvez essayer ceci:

var nameText = $("#name");

nameText.attr("disabled", "disabled");

nameText.change(function () {
  if(nameText.val().length > 0) {
    nameText.attr("disabled", "");
  } else {
    nameText.attr("disabled", "disabled");
  }

});

1 commentaires

N'oubliez pas de couper la valeur avant de vérifier la longueur

7
votes

Le seul problème avec la solution accompagnée est que le bouton est activé uniquement après la mise au point est supprimé du champ de texte (après avoir saisi des données en cours). Ne devrait-il pas être activé dès que tout texte est entré dans le champ? Voici une solution qui implémente cela.

lien vers une autre solution: Gardez le bouton désactivé si le texte n'est pas entré

quelque chose comme ceci: xxx

0 commentaires

0
votes

    const controls = document.querySelectorAll("input, select");
    for (const c of controls){
      c.oldValue = c.value + c.checked;
    }
    var trackControls;
    (trackControls = function() {
      var disabled = true;
      for (const c of controls) {
        if (c.oldValue !== (c.value + c.checked)) {
          disabled = false;
          break;
        }
      }
        var selector = document.querySelector("[type=submit]");
        if (selector != null) { 
              selector.disabled = disabled; 
        }
    })();
    document.oninput = trackControls;
    document.onchange = trackControls;
If you're not concerned about the cross browser compatibility. const does not work in IE

0 commentaires