0

I'm doing some form validation, and am currently disabling the submit button like this:

$("#button").prop('disabled', true);

I'm wondering what the best practice is for disabling a button, though. Surely there's no point in doing server-side validation via AJAX if you're just disabling a button with js/jQuery - a user could easily un-disable the button in their browser and be on their way.

What's the safest way to go about this?

j_d
  • 2,818
  • 9
  • 50
  • 91
  • What do you mean by "safest"? The safest option for your application is to do validation on the server side when your form is submitted. Your front-end should focus on providing the best user experience, not to go to hell and back just to make sure that the user can't enable a button. – cbr Jul 18 '15 at 10:58

2 Answers2

5

You should always be validating data on the server side.

Ultimately the end user could by pass the browser all together and use fiddler for example, so client side validation is a convenience to improve user experience.

So, disabling the button, should be fine, but also remember that pressing enter/return button in fields also submits forms in most browsers.

The below will prevent submission if some condition you specify is true.

$(document).ready(function(){ 
     $("#form1").submit(function(event){
      if(someCondition)
           event.preventDefault(); 
      });
});
BhavO
  • 2,406
  • 1
  • 11
  • 13
0

$("#button").prop('disabled', true); is best way to disable a button at CLIENT SIDE.

Bug again you have to validate all things before processing at backend. Thus you have to apply validation two times,

  1. To display that "something is wrong with input",
  2. To validate all input finally before processing at backend (when user submits form).
Bhavesh G
  • 3,000
  • 4
  • 39
  • 66