I want a class in JavaScript through which I can validate all the Input Boxes on a form. I just want to supply the form name and it must validate the input boxes there in.
Is there any class or something other through which I can achieve this?
Have you looked at the validator plugin?
http://docs.jquery.com/Plugins/Validation
If you don't want to use JQuery I described an alternative library in an earlier post
What JavaScript library to use for client-side form checking?
That allows you to just add attributes like REQUIRED or DATE to an <INPUT> tag.
It's a bit old-hat now, but we are still using it in production :)
Related
I have a form with many different input fields (some of them are not really input but behave as inputs).
When submitting the from from the regular button click each field is validated through angular validation and html - such as required, ng-maxlength, minlength, etc..
Now we want to add a shortcut to submit the form on keyboard click. That code is running from the controller behind the html. How can I check the validity of the form from there? I know I can get the form by document.forms["myForm"] but can I use that somehow to check the validity same way as .$valid is working in the html? Could I somehow show the error messages on the html as well?
I tried to add jQuery validation plugin for that but seems like it is too much work to change the entire validation mechanism
Don't get the form withdocument.forms["myForm"]".
It's bad practice to use DOM manipulation inside a controller.
You can access the form with $scope.myForm. But beware of the fact that it will be initialised asynchronously.
But that shouldn't be a problem when you want to access the form after a keyboard click.
When you access the form with $scope.myForm you can iterate throw the $$controls. In this object are all form fields.
For example you can do it like this:
angular.forEach($scope.myForm.$$controls, function(value, key) {
value.$setDirty();
value.$setTouched();
});
And one more reminder when you use angular don't try do use JQuery for everything. If you want to use plugins search for angular plugins
I want to use the 'validate' method that is included jquery validation engine plugin, whilst also be able to pass in a few available options to ensure that the validation errors show in the correct way, such as the 'promptPosition' option.
Due to the nature of the framework that I am using which is Meteor.js, I cannot use the default submit functionality to submit a form, nor can I use Ajax straight off the bat. I would have to override default submit functionality, validate the form, then do the manipulations that I need to do to the backend, which is in javascript.
Is it possible to do something like this with this plugin?
$('form').validationEngine('validate', {promptPosition: 'topLeft' });
I know that you can just use: $('form').validationEngine('validate') but I do need some the plugin's custom options available similar when you use the 'attach' method.
Cheers.
I isn't possible to define options when calling validate. The only solution I can think of is to use something like this:
var myForm = $("form");
myForm.validationEngine('attach', {promptPosition : "topLeft"});
// other js...
// when you want to validate the form use:
myForm.validationEngine('validate');
You set the desired options when "attaching" the validation engine. You then trigger the validation manually. To prevent the validation getting triggered by the user just use a button instead of input type="submit".
Here's a demo of what I'm trying to explain: http://jsfiddle.net/jxWp8/2/
yes it is possible:
you can look at line 35 at this code for it specifically.
https://github.com/carlo379/bitstarter/blob/master/assets/js/toolspin.js
and you can view that form works in
http://www.toolspin.com
it's how he implemented it for our school project
I'm using jQuery validation engine for field validation
On page load there are already fields available, and the validation works correct
for them, but there are some buttons which add fields dynamically, and those
validations won't work obviously :) I tried initializing the instance again but it
doesn't work.
Is there a method by which I can manually add validation instance to those field which
I have added dynamically
EDIT: Sorry forgot to mention, I'm using this plugin
http://www.position-relative.net/creation/formValidator/index.html
Thanks,
Mo
This article helped me very much: http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/
You should validate a container in which you have dynamically added elements
i am creating a sign up form in which there are 7 required fields, i want to validate those required fields using javascript.
i tried if-else block but its troublesome and confusing, is there any other way to do those required field validation in javascript, without using jQuery validation library?
Thanks.
If you are using html5 you may want to take a look into the newer input tag attributes.
http://www.w3schools.com/html5/att_input_required.asp
see http://www.w3schools.com/js/js_form_validation.asp
and http://php.net/manual/en/filter.examples.validation.php
both sites have form validation made easy, PHP's is built-in
You can use the pattern attribute which is a regular expression that is checked against the content of the field to determine whether or not the field is valid. Also, to make sure that the field is not empty, you can use the required attribute.
I want to write a plugin to validate forms. I have made detailed research about that but I want to write it with my own way. I dont want to write so many lines of code when using the library. It should be easy to use.
I found a jQuery library for validation. It uses HTML classes. For example if you want to a field with presence validation you just add the field required class done but I am not sure this is this is clear way. So I am confused with this, so anyone can tell me which is the best way to write a form validation library?
Actually the I found the jQuery validation plugin way is a very nice of dealing with validation logic. Here are some my reasons for it..
Its un-intrusive. You need no extra
markup on your form elements.
Used by many other plugins so
replacing one with a better one
should be relatively simple
Elements having same class will get
same validation logic and chance of
missing is rare (all date elements
will get same date logic, although
you can easily override)
You can use the same class to add
extra logic and same UI look and feel
(obvious) too and you are sure that
they all behave the same. (I add a
jquery rule to make all date elements
has a date picker too)
Adding and removing rules can be done
relatively easy with out change to
your markup.
I the method you describe is a good one. You can easily query anything with a class of "required", determine its type and check for a selected value. You can do this for all input types.