Does anyone know how to employ a fully function javascript client side validation?. Say we have a form with a fields for name, address, contact number, age, date and we want to validate. I have done this using regExpressions but need someone experts code to look and compare with it. Many thanks and do reply
this is a nice one : jquery-form-validator
and another one :
How to Validate Forms in both sides using PHP and jQuery
and here is a demo how it will look
I'm no 'expert', but I began writing my own client-side input validator not long ago. You can see the code at https://github.com/kaimallea/input-validator.
Related
I have a textarea that is defined thus:
<textarea spellcheck="true"></textarea>
When users type, spelling mistakes are highlighted to them (using a red underline, for my browser). Is there any way (using jQuery) to check whether there are spelling mistakes before a user submits the form?
This is what I want to achieve:
Form input textarea: [Typing some text in thsi box] [submit]
Before the user clicks submit, I would like a listener to "catch" the fact that "thsi" was spelled incorrectly and prompt the user. Is there any way to do this via the html5 spellcheck method, or do I have to use a custom javascript function for the spellchecking and listening?
A quick search brought up this jQuery plug-in that seems to do exactly what you want and it uses the Google spell-checking API https://code.google.com/p/jquery-spellchecker/wiki/Documentation
There is also Typo.js https://github.com/cfinke/Typo.js, which is a client-side based library. It does not use any API, instead it uses Hunspell-style dictionaries and it is only available for American English "EN_US".
If you don't want to use a plug-in or an existing code snippet, you can build your own by sending an ajax request to check the typed text against a service provider (Google in this case).
you can use jquery plugin for checking spelling.
i hope it helps you, thanks.
JavaScript SpellCheck
http://www.javascriptspellcheck.com/
If you have to build it natively you might consider building a Trie datastructure for this
check this Trie reference 1
Trie reference 2
Hope this helps
You have different ways to achieve it, it depends if your spelling has to be focused on a subject (like medical word spelling) or is it general.
Create yourself a dictionary (not the best choice and too long to make)
make a query to online dictionaries like google
try Jspell Evolution (the installation is a little annoying but once done it works very well Jspell Evolution website
you can look at typo.js typo.js article
Yesterday I found this article that is 10 times better than the others :
Article for javascript spell check locales where you can also have spelling for other languages/locales and not only english locale.
I have a complex form with some fields that are generated on the fly using JS/jQuery.
The problem with this generation on the fly is the complexity to validate this fields on the server side. I don't know if I should store the generated forms and values generated by the JS and try to validade on the server side or by other hand use another approach like validate all on the client side(easier I think).
My question 1 is: It is possible to do all validations using JS? There is some JS validation framework that will help me on this task? I've goggled and have found LiveValidation(www.livevalidation.com), is this what I need?
Question 2: What problems I will have using this kind of approach(validata all on the client side)?
Some clues, thoughts?
Best Regards,
André, we do that all the time. Javascript validation is a key point and has to be performed before a submit occurs, the main reason being
to make the site / page user friendly
not to actually check, verify, fix the data before it is sent to the server, since the JS validation can be easily bypassed (so there should always be another round of checking server side), thanks to Firebug, Chrome... and a bunch of command line tools.
You use JS validation to, for instance
ensure the user filled all mandatory fields, and point to the missing field (focus)
check the type of the data entered, and warn user
ensure fields consistency (card number, birthdate, fieldX with fieldY...)
...
Besides, to answer your last question, and to paraphrase the beginning of the answer (doesn't hurt)
JS validation does not ensure the data sent to the server is clean / solid / consistent (it cannot as JS validation can easily be bypassed)
the server has to perform the same validation - or stronger - on all fields, and never trust the user input (SQL injection risks etc...).
Yes it is very much possible to do all validations on Client side except for the darkside that all client validations can be bypassed. A good and easy plugin to performa validations is Jquery Validate Plugin
Validations on the client-side is merely just for UX purposes (speed, ease, user-friendliness, immediate response etc.) and never for real validation. JS validation is easy to bypass. One can even submit data to the server without using a form, thus skipping the client-side altogether.
For security purposes, the server should do the validation. Your validation logic should adapt to the dynamic nature of your forms.
As far as I know, dynamic forms usually use arrayed forms, like this one in PHP. That way, it's easy to look into dynamic forms on the server-side, especially those that have repeating groups of fields.
If the browser disabled the javascript , then how to validate the html file ? I am not talking about 'how to enable javascript, but how to validate the html form without using javascript ? This question is asked by an interviewer.
Form validation must always be performed server-side. Client side validation is great, but optional. Surely this is what the interviewer was looking for.
You can refer one of the example from How to validate html for input without using javascript.
Javascript is the only way to validate the data on the client side
before it is submitted. Since Javascript can be disabled, your
server-side code should always validate any submitted data before
using it.
Not sure what 'validate' means in that context (might be a good chance for you to ask a follow up question on what he/she means on html validation?)
Anyway, I am assuming that they are talking about HTML markup validation then there are online services like:
http://validator.w3.org/
If the interviewer is talking about validation in terms of client-side validation (eg user age must contain range between X to Yetc), then you might need to validate the input on the server (eg with server side code).
In my website I have a forum, and I want to avoid cross site scripting. Do you know a good input validation script?
There are two ways to avoid Cross Site Scripting.
Filter the inputs by the users
(mainly script tags and html tags)
both at client side as well as on
server side.
Display the contents as
Html entities to avoid Cross Site
Scripting. Ofcourse if you want to show some
of the tags, go for option one.
Otherwise option two is more
reliable.
You can use regular expressions to filter the data both on client side as well as on server side.
I've always relied on the OWASP PHP filters: http://www.owasp.org/index.php/OWASP_PHP_Filters As you can tell from the name, they're server-side (JavaScript or HTML5 validation is only useful for assisting the user) and OWASP (the Open Web Application Security Project) is a non-profit organisation.
It depends on where do you want to write out the data. For example you need different filter when you write the text into an input field and when you write it simply into the html body, between two tags.
You should implement different filters for the different data types on server side. I suggest you should filter the text when it's printed out, and not when the user sends it to you(of course it's not about sql injections and other server side tricks), because (as I mentioned above) the type of the filter you should use is depends on where the data is printed out.
If you want to write a really simple forum, then it's enough to write only one filter, wich simply removes all html tags from the text before it's printed out. Beware, it's not good for advanced functions, for example edit comments, when you prefill a form for the user, or if the users can use any html tag in their comments, etc.
Simple. Make sure you escape the HTML from your input object before using it. This way, the data sent will be treated as raw text. The way to do this will be to pass the input through some parser before embedding the data in your page (or working with it somehow).
I agree with anand that there are two major ways to avoid XSS: validation on input and escaping on output. For validating form input, tie into Django's Form Validation Framework: http://code.google.com/appengine/articles/djangoforms.html
Here are some code samples for sanitizing on output within a Django templating. Instead of this:
Welcome, {{ firstname }}!
Do this:
Welcome, {{ firstname|escape }}!
This is from this very good blog post: http://startupsecurity.info/blog/2008/10/28/avoid-xss-on-google-app-engine/
Server Side
http://www.php.net/manual/en/function.html-entity-decode.php
http://www.php.net/manual/en/function.addslashes.php
http://www.php.net/manual/en/function.stripslashes.php
Check more string functions you need to validate
Client Side
http://www.position-relative.net/creation/formValidator/
better to write your own jquery code, in future it may help you
You have two option for validation. for non-sensitive data client side JavaScript may be use.
in JavaScript, you can write simple function for validating your data.
for sensitive data, you should be use server side scripting like, php,jsp,asp,asp.net etc.
may this will help you.
Over the years, I've dabbled in plain JavaScript a little, but have not yet used any JavaScript/AJAX libraries. For some new stuff I'm working on, I would like to use a js library to do client-side form validation, and want to know which would be best for that. By best, my criteria would be: quick and easy to learn, small footprint, compatible with all popular browsers.
Edit: Thanks for the ASP suggestions, but they're not relevant to me. Sorry I didn't originally mention it, but the server is a Linux box running Apache and PHP. As I know I should, I plan to do server side validation of the input, but want the client side validation to improve the users' experience and to avoid as much as possible having the server reject invalid inputs.
Edit 2: Sorry I didn't reply for months! Other priorities came up and diverted me from this. I ended up doing my own validation routines - in addition to the good points made in some of the answers, some of the items I'm validating are rarely used in other applications and I couldn't find a library with that sort of validation included.
You could use jQuery and it's Validation plugin.
I don't use libraries myself, but dived into some (like prototype, (yui-)ext, the seemingly omnipresent jquery, mootools) to learn from them and extract some of the functions or patterns they offer. The libraries (aka 'frameworks') contain a lot of functionallity I never need, so I wrote my own subset of functions. Form checking is pretty difficult to standardize (except perhaps for things like phone numbers or e-mail address fields), so I don't think a framework would help there either. My advice would be to check if one of the libraries offer the functionallity you look for, and/or use/rewrite/copy the functions you can use from them. For most open source libraries it is possible to download the uncompressed source.
It needs to be said (by the way and perhaps well known allready) that client side form checking is regarded insufficient. You'll have to check the input server side too.
Before AJAX Libraries I used Validation.JS by Matthew "Matt" Frank.
The basic idea is that you include a JS file and then add attributes to your INPUT statement.
Example:
<input name="start-date" type="text"
display-name="Start Date" date="MM/YYYY" required="#getRequired()" />
Field will be validated as a date in MM/YYYY style. Any error message displayed will refer to the field as "Start Date". The "#" prefix will cause the getRequired() function to be evaluated at run-time.
A variety of things are provided as standard (Currency, Date, Phone, ZIP, Min/Max value, Max length, etc), and there is a keystroke filter; alternatively you can roll your own - most easily by just defining a Regular Expression for the field, but you can add Javascript Functions to be called to make the validation.
There are pseudo events for handlers to catch before/after field and form.
In additional to Attributes in the INPUT statement, validation actions can be applied to the field by JS:
// Set field background when in error state
document.MyForm["INVALID-COLOR"]="yellow";
// Show error messages on field blur
document.MyForm["SUPPRESS-ONCHANGE-MESSAGE"]=true;
document.MyForm.MyField.REQUIRED = true;
document.MyForm.MyField.DisplayName="Password";
Validation.JS is 28K (uncompressed)
I've had a bit of a trawl around to try to find an HTML file you can easily get to with details, but I can't fine one standalone that I can link to.
The source code is here:
http://code.google.com/p/javascript-form-validation/source/browse/#svn/trunk
and the DOCs are in the HTML files - but you can't view those as HTML, you have to download them and then view them, as far as I can make out
I do most new stuff in ASP.NET with AJAX, so I use the ASP.NET validators with the AJAX extenders, and they work great. However, if you are not into ASP.NET this isn't going to help you.
Most major JavaScript frameworks (jQuery, YUI, Prototype, etc) have validation capabilities, so you could consider them. But depending on your needs, you might regard it as overkill.
Previously (in ASP Classic) I used my own validation script which was only 6KB; I obviously don't now because I like the consistency and polish offered by these frameworks, but YMMV.