/    Sign up×
Community /Pin to ProfileBookmark

Handler and form submission

I use
[url]http://bassistance.de/jquery-plugins/jquery-plugin-validation/[/url]

When validation is correct user can refresh page where is confirmation message. As I like to use handler to avoid submitting form values, need help how to do in the correct way.

[B]Example is like:[/B]

[code=php]
// specifying a submitHandler this will submit the form after we have validated ok
submitHandler: function() {

return false; // avoid the actual submit of the form.

}
[/code]

Is this possible using jQuery and handler?

to post a comment
JavaScript

8 Comments(s)

Copy linkTweet thisAlerts:
@rootFeb 08.2014 — Why bother when you can do it in straight JavaScript. If you want to know, please ask in the JavaScript Frameworks forum.
Copy linkTweet thisAlerts:
@alouFeb 08.2014 — I use

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

When validation is correct user can refresh page where is confirmation message. As I like to use handler to avoid submitting form values, need help how to do in the correct way.

[B]Example is like:[/B]
[code=php]
// specifying a submitHandler this will submit the form after we have validated ok
submitHandler: function() {


return false; // avoid the actual submit of the form.

}
[/code]

Is this possible using jQuery and handler?[/QUOTE]


Assuming you have set your validation, something like that:
[code=php]
$("#someForm").validate({
rules: {
fieldName: { required: true, minlength: 1 },
...
},
..messages & other params
}
});
[/code]


your submit handler should not return false but prevent default, then check each field for validation.

[code=php]
// specifying a submitHandler this will submit the form after we have validated ok
submitHandler: function(e) {
e.preventDefault();
$("#someForm input').each( function(){
var testit = $("#someForm").validate().element(this);
if (!testit) {
//if i am not mistaken, validation will add an invalid class there, if not you should mark it somehow for check after the loop
//handle invalid field
} else {
//handle valid fields
}
//here check for invalid class, whichever way you do it
if (!$('#someForm .invalid').length) {
$("#someForm').submit();
}

}
[/code]


most possibly i have some syntax errors as it's no tested.
Copy linkTweet thisAlerts:
@toplisekauthorFeb 08.2014 — Will this prevent posting form when user refreshes browser?
[code=php]
jQuery(document).ready(function() {
// validate signup form on keyup and submit
var validator = jQuery("#validationForm").validate({
rules: {
firstname: "required", //Set the first name field to be a required Form

email: {
required: true, //Set the e-mail field to be a required Form
email: true, //Set the e-mail field to be validated as an e-mail address
},

},
messages: {
firstname: "Enter your firstname",
email: {
required: "Please enter a valid email address",
minlength: "Please enter a valid email address",
}
},

// specifying a submitHandler this will submit the form after we have validated ok
jQuery("#validationForm").validate({
submitHandler: function(form) {
form.submit();
}
});

});


});
[/code]
Copy linkTweet thisAlerts:
@alouFeb 08.2014 — Yes, the preventDefault function does that as long as you pass the event object, i.e. someFunction(event) { event.preventDefault(); ) } will stop an element's default behaviour for the binded event.

And especially in jQuery, it's much better to use that instead of return false;
Copy linkTweet thisAlerts:
@rootFeb 08.2014 — What part of ask in the JQuery forum don't people understand?
Copy linkTweet thisAlerts:
@toplisekauthorFeb 08.2014 — I have tested and refreshed browser on confirmation page.

Browser IE or Mozilla ask the following enclosed message.

Even this message can not send any values inside form. Is this correct as I have received form values (they are not empty form values)

[canned-message]attachments-removed-during-migration[/canned-message]
Copy linkTweet thisAlerts:
@toplisekauthorFeb 08.2014 — I receive an error like:

Error: SyntaxError: missing : after property id

Source Code:
[code=php]

jQuery(".myformid").validate({

[/code]


What king of issue is with this?

Can be used?

.my_contacts-form1

IE reports and error like:

Object doesn't support this property or method


jQuery(".my_contacts-form1").validate({
Copy linkTweet thisAlerts:
@PadonakFeb 08.2014 — What part of ask in the JQuery forum don't people understand?[/QUOTE]

here <gives him a big butcher's knife> ?
×

Success!

Help @toplisek spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...