Jump to content

[SOLVED] Preventing button click without all fields filled in...


DBookatay

Recommended Posts

I've seen a script in the past (can't remember where though) where the submit button would only allow you to click it if all the required fields are filled in, if not it was transparent on the page.

 

Because of how my page is layed out, with a "tab" type navigation this would be a good option for my form. Does anyone have a script like this, or know what I am talking about?

Link to comment
Share on other sites

Here is a good/basic example:

http://www.w3schools.com/js/js_form_validation.asp

 

You will find that they use an onSubmit for the entire form.  Remove that, and simply do an onChange, to validate the field as they leave it.  When the entire form validates properly you can update your submit button. 

 

Hint: You can use disabled on the button: <input id="submitButton" type="submit" disable="true"> -- When it validates use: document.getElementbyId('submitButton').disable="false";

 

Best, Nathan

 

 

Link to comment
Share on other sites

Here is a good/basic example:

http://www.w3schools.com/js/js_form_validation.asp

 

You will find that they use an onSubmit for the entire form.  Remove that, and simply do an onChange, to validate the field as they leave it.  When the entire form validates properly you can update your submit button. 

 

Hint: You can use disabled on the button: <input id="submitButton" type="submit" disable="true"> -- When it validates use: document.getElementbyId('submitButton').disable="false";

 

Best, Nathan

 

Thanks for the lead... After reading your post I found this script: http://www.javascriptkit.com/javatutors/deform4.shtml which is exactly what I was trying to do...

Link to comment
Share on other sites

This isn't a great idea actually. Less... knowledgeable.. users may not realize that the button is blanked out because all the fields have not been filled in, and may end up just exiting your site. You are better off leaving the button active, then informing them in some manner that they haven't filled in all the fields.

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.