how to disable submit button until form is filled

Question

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.com/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>

Your fiddle is working properly as expected .Whats the problem?Form is not submitting till i fill data.Its ok.Whats wrong? — Pratik Joshi, Jun 01 '14 at 08:54
How its working? for me after fill the text fields, the button still disabled. — Oshrib, Jun 01 '14 at 08:55

score 3 · Accepted Answer · edited May 23 '17 at 12:31

3

I posted working fiddle ,Is this what u want ? http://jsfiddle.net/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);
}
});
});

edited May 23 '17 at 12:31

Community

1
1

answered Jun 01 '14 at 09:00

Pratik Joshi

11,485
7
41
73

why all the minus on my question. its fact - something not work for me, jsfiddle is just for the example, on the site it not working, i think its legitimacy question – Oshrib Jun 01 '14 at 09:06
1

Your site is working well.Whats the problem,I filled all fields and it submitted.You please Press LONG: CTRL+F5 to clear cache and test again. – Pratik Joshi Jun 01 '14 at 09:08

score 1 · Answer 2 · answered Jun 01 '14 at 08:55

1

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

answered Jun 01 '14 at 08:55

entio

3,816
1
24
39

score 0 · Answer 3 · answered Jun 01 '14 at 08:56

0

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

Sor wrap it with

$(document).ready()

answered Jun 01 '14 at 08:56

SomeoneYouDontKnow

1,289
10
15

how to disable submit button until form is filled

HTML

JQUERY ON HEAD

3 Answers3

Linked