required field validation in html5 form using javascript - javascript

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.

Related

Validate a from when submitting from outside of html submit

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

Is it possible to select one input field and trigger a validation on that field only with Parsleyjs

Using parsleyjs I would like to trigger a validation on only one field so I was hoping that this would work:
$('.form-input-field').parsley().validate();
But it does not work. Calling .parsley().validate() on the form it self does work thought and validates the whole form:
$('.form').parsley().validate();
Is there a way to manually validate only a single element?
Why I want to do this is because an error message needs to be visible when the parsley is initialized or as soon as possible before the user actually interacts with the element (but as mentioned only for one field in the form).
For this purpose, parsley has data-parsley-group attribute.
Check this fiddle. Also, check official documentation
So you field validation will look like
form.parsley().validate({group: 'group-1'});

Symfony sfValidators: Dynamically setting a value to be required or not?

I have the following problem:
I have a form where a user can opt to toggle a switch (Yes/No).
If they select Yes, I hide a couple of fields on my template (because they will now automatically be calculated).
The catch is that now, a set of different fields are required to not be empty for the successful submission.
The first fields need not be optional after the switch is clicked (since they are merely hidden but still submitted), but the second set of fields must be non-empty.
Is there a simple way to get this dynamic validation behaviour using Symfony's sfValidator classes, or should I simply hack together a solution using jQuery?
This sounds like a perfect case for the Callback constraint that already exists in Symfony. To quote the linked doc:
The purpose of the Callback constraint is to create completely custom validation rules and to assign any validation errors to specific fields on your object. If you're using validation with forms, this means that you can make these custom errors display next to a specific field, instead of simply at the top of your form.
This solves the backend, you still need to watch out for the required attributes of your fields so HTML5 validation can work properly.

Jquery validator allow only specific array of string

I know that using jquery validator we can allow specific characters in a textbox while validating form.
Is it possible that jquery validator should not allow specific array of strings. We can't write plenty of lines to check whether equal or not.
Thanks in advance:-)

Validating all entries in Input Boxes

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 :)

Categories