Front End Validation and Backend Validation.

[krash11554]

I know backend validation is much more secure but how could i combine both validations. the thing that is tricking me is, say someone dosent meet the requirments, the front end would get a error but also the backend, but it will display the same error twice.  Cant seem to find any tutorials. 

Srry for the bad explanation.

[DavidAM]

If the back-end receives bad data, then the user either ignored the error or has JavaScript turned off. If they ignored the error message then getting it a second time (from the server) is their own fault. If they have JavaScript off, then they never saw the error message in the first place. Don't worry about repeating yourself, just enforce your validation.

 

Always design and develop your pages so they work 100% without JavaScript. Then add JavaScript to enhance the user's experience.

 

Never depend on front-end validation! It is there so the user get's faster responses. The reduced server load is a side-benefit to you.

[krash11554]

but wouldnt you just get the same error message twice?

[DavidAM]

but wouldnt you just get the same error message twice?

 

I'm not sure what you mean by "you get the same error".  The server knows nothing about the front-end. All it knows is that a request was made and the data is not valid.

 

... If they (the user) ignored the error message then getting it a second time (from the server) is their own fault.

 

There are different ways to do front-end validation. You can do validation on each field as it is entered, you can intercept the submit and validate the data before it goes to the server, or you can combine the two. There are probably other ways as well.

 

If you explain how your validation is done, and where you think the duplicate message will come from, we might be better able to explain it.

[krash11554]

I know the way to validate as you enter, But How about when you submit the forum, Say the user enters something wrong, the code will display a error message from the front end when it validates. and Then the back end will validate the same info the user puts in the forum and will display the same error message.

How do you combine the two validations. Cant seem to find any videos on it.

Thanks.

[squigs]

Typically if you do as DavidAM has suggested and create your form so it is working without client side validation and then add your javascript for client side validation afterwards what will happen if you write your validation code correctly is that the server side validation will not ever occur.

 

Essentially is a user leaves a field blank and you have written form validation that does not allow that, the process will never be carried out in the server side thus the error will not be repeated. You will notice if your javascript is not written correctly you will end up for example seeing a javascript alert followed by your server side error message as well.

 

In otherwords if you are doing it right the front end validation will stop the back end from happening.

 

I hope that explains it a bit better otherwise you may have to be a bit more detailed in your question.

 

[DavidAM]

If you are doing the validation on submit

 

<INPUT type=submit onclick="checkSubmit()">

 

Then you just have that function (checkSubmit()) return false to prevent the browser from submitting the form. Then the front-end validation shows the error, but the data is not sent to the server. If everything checks out OK, then the function should return true to allow the data to be submitted to the server.

 

Note: I think that is correct, but I usually do it field by field, so I don't remember the exact process.

[Christian F.]

Close, DavidAM, you have to use return checkSubmit ().

Other than that I'd really recommend to put it on the onsubmit attribute of the form element, that way it'll trigger no matter how the form is submitted.

[DavidAM]

return! I knew I was leaving something out, but couldn't remember it.

 

onSubmit: Good point. That is really where it belongs.

 

 

[Christian F.]

You're welcome, glad I could help.

[krash11554]

I'm starting to understand this now but how does the JavaScript stop the server side validation from being run? A simple if else statement to check if the function returns true or false ?

 

[codefossa]

If the JS check returns false, the form isn't submitted.  The server never sees what the user put in until it's correct and the form allows submission.  If you don't submit it, the server never sees it and the validation is never run.

 

If JS is off as they said above though, the client-sided check will be skipped, leaving the server to check it and deny incorrect inputs.

 

Just as a small preference, if you're doing text field validations.  When you do it as they type, you can enable/disable the submission button so they can only submit when it's correct.  It's a much faster (real-time) check, rather than filling it out then finding out everything that's wrong.  You can see it as you go.

[Pikachu2000]

It doesn't stop server side validation from being run. The two are completely independent from one another. If the client side and server side checks are done using the same parameters, the server side validation should pass all the data and not give the user an error message as long as the user hasn't disabled javascript.

[hobbiton73]

Hi, i'm not sure whether this will help at all, but I've recently dealt with this for my current project and, I too found it difficult to get my head around

 

The following links are what I used as a starting point. They provide fairly simple examples to the more advanced.

 

Anyway this is the link for the front end http://net.tutsplus.com/tutorials/javascript-ajax/building-a-sleek-ajax-signup-form/ and this is source for the back end validation I used http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/

 

I hope it helps.

 

Kind regards