I know there is a lot answers for that out-there, but from some reason it not working for me.

You can view the code on JSFiddle

There is mistake on the position of the script? with one of the inputs id ?

The problem: after fill the text fields, the button still disabled.

HTML

<form class="form" name="contactform" method="post" action=".php">
    <input  placeholder="Your Name*"  type="text" name="name" maxlength="50">
    <input placeholder="Phone *"   type="text" name="telephone" maxlength="30">                    
    <input placeholder="Email *"   type="email" name="email" maxlength="80">
    <input class="send" id="register" type="submit" value="Send" disabled="disabled">

    <p>* = Requierd fields</p>

</form>

JQUERY ON HEAD

<script src=".11.1/jquery.min.js"></script>

<script>
(function() {
$('form > input').keyup(function() {

  var empty = false;
  $('form > input').each(function() {
  if ($(this).val() === '') {
  empty = true;
  }
  });

  if (empty) {
    $('#register').attr('disabled', 'disabled');
  } else {
    $('#register').removeAttr('disabled');
  }
  });
})();
</script>

I know there is a lot answers for that out-there, but from some reason it not working for me.

You can view the code on JSFiddle

There is mistake on the position of the script? with one of the inputs id ?

The problem: after fill the text fields, the button still disabled.

HTML

<form class="form" name="contactform" method="post" action="https://lp.outit.co.il/LA-FACE/send_form_email.php">
    <input  placeholder="Your Name*"  type="text" name="name" maxlength="50">
    <input placeholder="Phone *"   type="text" name="telephone" maxlength="30">                    
    <input placeholder="Email *"   type="email" name="email" maxlength="80">
    <input class="send" id="register" type="submit" value="Send" disabled="disabled">

    <p>* = Requierd fields</p>

</form>

JQUERY ON HEAD

<script src="http://ajax.googleapis./ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
(function() {
$('form > input').keyup(function() {

  var empty = false;
  $('form > input').each(function() {
  if ($(this).val() === '') {
  empty = true;
  }
  });

  if (empty) {
    $('#register').attr('disabled', 'disabled');
  } else {
    $('#register').removeAttr('disabled');
  }
  });
})();
</script>

• javascript
• jquery
• html

Share Improve this question Follow asked Jun 1, 2014 at 8:51 OshribOshrib 1,9001313 gold badges4242 silver badges6969 bronze badges 2

• Your fiddle is working properly as expected .Whats the problem?Form is not submitting till i fill data.Its ok.Whats wrong? – Pratik Joshi Commented Jun 1, 2014 at 8:54
• How its working? for me after fill the text fields, the button still disabled. – Oshrib Commented Jun 1, 2014 at 8:55

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

I posted working fiddle ,Is this what u want ? http://jsfiddle/qqwcu/2/

Note its preferred to use: $('#register').prop("disabled", false); Check this Remove disabled attribute using JQuery?

 $(document).ready(function(){
$('form > input').keyup(function() {

var empty1 = false;
$('form > input').each(function() {
if ($(this).val() === '') {
 empty1 = true;
}
});

if (empty1) {
$('#register').attr('disabled', 'disabled');
} else {

     $('#register').prop("disabled", false);
}
});
});

Your fiddle is fine, although ,You havent included jQuery there. Did that solve the problem?

Your code is run, when the DOM is not yet ready.

Sor wrap it with

$(document).ready()