I'm already familiar with how to use onSubmit to evaluate form content against RegEx to ensure it meets static parameters for acceptable content. What I'm wondering is if there is a way to further provide validation against a MySQL database, such as if you want to make sure an e-mail address hasn't been used yet before submitting a form and having to re-load the field data back into the proper places for correction.
Unless you sent all the valid email addresses to the client (you wouldn't) then you're going to have to do some sort of server roundtripping to validate the field, which is equivalent to submitting the form. But using AJAX you can fully validate the form without the user experience being compromised; to them it will look like any other client-side validation. There are JQuery plugins to help make AJAX-based validation easier to code, but it isn't too hard to roll one up yourself.
you have to use a serverside language for that: php, perl, python... as javascript (client-side technology) cannot communicate with a mysql server (serverside technology) directly.
In javascript you could use the AJAX methodology if you want to avoid the full page refresh. Try using jquery, (a javascript library that take care of crossbrowser issues and simplifies greatly rich interaction programming) and its $.ajax() function. This has been made really easy through the use of the jquery form plugin.
Most examples of this kind of validation use some kind of asynchronous request back to the server to do the lookup in the database. Either by using XMLHttpRequest or some other Ajax style method.
I'd recommend creating a small URL end-point that you can make a quick HTTP request to sending the email address to check. It can return either true or false in a simple JSON response.
Related
Well, hello everybody, I faced with a big problem which I can't solve.
So, here is it: I need validation, but I have my own expectations towards it.
So, what I do:
Here everything goes right as I suppose...
I get the values from fields (e-mail(text input), username(text
input), sex(radio btns), birth date(select lists),
password&repeat_password(password inputs).
Then I handle and validate those values. For example: I check if email is not empty, if it fits the pattern, if birth date is right and real, if password fits needed limitations. Another words, here I validate all params without AJAX, just using custom JS.
After validation, I get the responses from each field with messagies of validation result and the result(Boolean) itself.
HERE'S THE PROBLEM COMES UP
So, as I have results of validation, now I need to check if EMAIL is UNIQUE and if USERNAME if UNIQUE. This ofcs should be performed with AJAX, but IMPORTANT: I shouldn't perform request to server to check email if there were some problems with email before. If its OK, I send it. Same with username field.
AND FINALLY, validation is boundaried on onsubmit event, so I want to check email, username with no AJAX, then validate them on being UNIQUE if there were no errors before with them and then IF ALL fields are correctly validate, only at that case I send form, in other occasion I would like to use event.preventDefault() .
So, due to AJAX works in async way, I can't use event.preventDefault inside it, so that's first problem. Also I cant return anything from ajax callback to let system find out if there were any validation issues or not.
I am not asking for a solutions, I am not crazy, I understand that there is a lot to think about, BUT I want some of matured gyes helped me with advise, how to validate forms correctly using AJAX? How to divide code on blocks in validation and make it reusable, using async AJAX?? Pls, I'm struggling a lot. I've already written a lot of code to validate fields with no ajax, and I dont understand how to relate them with ajax, send the form if everything OK.
Can u share your expiriance in validating forms, how do u usually do it? How have u learnt how to validate forms? AND WHAT ARE BEST PRACTISES OF VALIDATING FORMS WITH AJAX?
When it reaches form validation, there are a few things you should keep in mind:
1. Importance of the transmitted information;
2. How reliable it needs to be;
3. How many requests you are going to have;
4. How much information your form is going to hold;
In my honest opinion, I would use Javascript/Ajax for quick and more accurate paths in your form. For example:
1. Validating date fields are in correct format;
2. Validating ages are matching your requisitions;
3. Validating a gender was selected (BTW it is gender you are looking for, not sex);
etc...
Anything that needs to be correct and secure on your website (specially passwords and emails, etc), if you want to validate such you should do it on your server. Always!
Now, if you form is too long, you can do a step by step registration, instead of all in one. You can keep the progress saved in the session (server side) and maybe use a cookie to inform your site that they started the registration before (for this you can use javascript);
NOTE: You should inform your user you are using cookies as it is mandatory due to GDPR :)
Both validations help making the user journey smoother. There are things you should defo use as Js validation for quick response and making sure user is aware of some mistakes before they submit the form.
Server validation is safer for the sensible data that you need to make sure is correct as user as no say in it.
But it really depends on what you are trying to achieve and how many resources you have available to you.
Ajax form validation overalls
Form validation
Hope it helped clear some things up! :)
use this
https://reactiveraven.github.io/jqBootstrapValidation/
this will help you to set all validation on client side, once fullfilled, it will hit the 'validation success call method' and then go to ajax,
You can also set custom validation like, minlength, maxlength,should contain, maxcheck, mincheck, email/phone formats , etc
revert if any problem
I have a textbox that I have set to hidden and readonly like so
<div id="employeechosen" class="form-group">
<input type="hidden" name="chosen" id="chosen" class="form-control" required="" readonly>
</div>
What can I do to stop people from being able to enter anything they want beyond this? All a user would have to do is hit f12 and change input to text and delete readonly and proceed to do what I do not want them to able to do.
What is the best way to lock down a text box to not be compromised?
I chose the tags below because they are the languages I am using if there is anything that can be done in any of those languages.
You must follow up client-side validation with additional server-side validation as well. It is the only way to ensure that you get valid data.
Trying to prevent bad data submission directly in the client is a good thing.
But you should always validate the submitted data on the server as well. Use validation logic, authentication and authorization to prevent attacks or unwanted behaviour.
You have identified client side code as your only technologies to keep people from manipulating the data in the client.
This is not possible.
If you want to make it very difficult for them, you can create a JavaScript method that obfuscates the values in the hidden field via an encode/decode function, but if they are a good enough coder, they'll be able to reverse engineer your encoding and manipulate it.
The only way to ensure this is using server-side validation as Scott Marcus said.
Do not depend on what you receive from front end. If someone is going through F12, they are not your website user (instead abuser). So better to keep track of the checkbox you should take help of-
On Client Side-
Cookies in JS
obfuscate the data
If Using Server Side Scripting-
Write values in database (After validation)
Keep values saved in Session (After validation)
Encrypt and pass values from one page to another
Simple, add validation functionality. Both jQuery Validator and KnockoutJS are great tools with simple implementation for field validation. You can set the specific validation rules in order to prevent bad data submission.
I am working on a site with many forms . Most of the forms will be submitted via jquery AJAX.
I have implemented recaptcha for security but the client does not like it as the words are sometimes difficult to read.
As an alternate I am looking at honeytrap method for less important forms. As I understand In this method I keep a field in the form hidden from normal users via CSS. So legitimate users will leave the field blank while a bot will fill it .
Now my question is since I am using jQuery AJAX for form submission, instead of hidden field if form , can't I just pass an extra variable (along with form field variables) from javascript to AJAX. (like var secretword = 1) AJAX will check this variable( if secretword == 1 ) and if it is empty(bot will not use javascript to sumbit form so var will be empty) then the form will not be submitted.For legitimate users javascript function will add "1" value to the variable.Is my method as secure as honeytrap?
NOTE: Website does not work without javascript so need not go into what happens if javascript is disabled.
Please provide me your valuable advice on this.
You're really over-thinking this.
If you only do legitimate submission via AJAX, make the form's action attribute wrong, and you've effectively accomplished what your proposed solution does: Anybody directly submitting the form without JS will have their submission ignored.
This obviously won't deter anybody from figuring out where you AJAX submissions are going and just spamming that endpoint directly, but neither will your proposed secretword=1 solution or a traditional hidden field.
I'm looking for a way to use custom ASP.NET validators to validate input, without using UpdatePanels, and without a full postback.
The validators do several things - not just length/regex, but some other non-standard stuff as well.
Javascript is required for our users, so I don't have to worry about normal users who have javascript turned off.
I see several options, but none are ideal:
1) Suck it up and use UpdatePanels. I'm in the "UpdatePanels are evil" group, so I'd prefer not to do this.
2) Without using validation controls, manually validate the fields by passing the values to a PageMethod static method, via jQuery or any other AJAX framework. This would require client and server coding each time I needed to use a validator.
3) Use jQuery (or any other javascript framework) validation for client validation, then if they somehow get by that, have server-code validation controls for full postback. This would require all of the validation rules to be written in javascript as well as C#. I don't care about the full failed postback at this point, because the javascript validation would catch real users who weren't trying to screw me over.
Is there alternative out there for using real CustomValidator controls, with partial postback, C# code only, for validating input without UpdatePanels and without a lot of redundant javascript?
Thanks
I'd use a mixture of 2 and 3.
First- Server side validation will exist regardless...
So I would make the fields that require simple validation logic javascript based (numbers, text, string lengths, string certain formats etc) with no ajax callbacks, and then use callbacks to the server where business rules or otherwise more complex validation needs to occur, so that complex rules are only coded once.
If you had to pick between either a very fast response (or no delay...js only), or valid data, I'd expect that valid data would win...So using 2 and 3 together hopefully will give you a faster response, but without compromising valid data.
Ajax callbacks to a generic handler etc should be a bit quicker than an UpdatePanel anyway as far less data would be being transferred...
Honestly, I think 2 is a good option. CustomValidator or not, you'll write the same server code to do the validation. You can do all the validation code in C#, and just write JS to call your validation method, which could be a PageMethod or a separate ashx. And really, you could probably write one JS function that takes parameters to make the AJAX call pretty easily.
What is everyone's favorite way to sanitize user data?
I've been using Javascript, but have recently required something more secure (people can turn it off, after all), so I was looking at Flex, but thought I'd ask the community what they thought.
NEVER NEVER NEVER use javascript or any other client-side technology for the only validation. You can use client-side validation to save some load on your server or make your app seem more responsive by showing the error sooner when validation fails, but you should always validate using server-side code.
Personally, I like the ASP.Net validation controls because it gives you the benefit of client-side validation with security of server-side, without having to write your logic twice. Of course, the stock controls are pretty bare, but you can extend them.
Validation should ALWAYS be done server-side. Doing it client-side, in addition, is fine.
How you do it depends on what your app is written in. Any language should be able to handle validation; the logic used is what matters, not the language.
It also depends on what you're doing with the data you're given. Putting it in a URL or storing it in a SQL database requires two very different kinds of sanitization. If at all possible, white-list valid values--don't black-list invalid values. Someone will always be able to come up with a new mal-input you hadn't considered.
Depending on the requirements of your project you may or may not want to implement client-side validation. However, server-side validation should ALWAYS be implemented. I prefer to white-list appropriate inputs and values as opposed to black-listing invalid data because this ensures that no one will ever slip something by that I failed to consider.
always use server side validation at the very least
use regular expressions
PHP Example:
preg_match('/^[\w][\w\,\-\.]*\#[\w]+[\w\-\.]*$/', $_GET['email'], $matches);
if (count($matches) > 0) {
$_GET['email'] = $matches[0];
} else {
die('invalid email address');
}
It's recommended to use both server- and client-side validation.
I use JQuery for client side validation.