i used custom css, jquery ui form error validation layouts along powerful jquery validation script. friend recommended check out qtip2 provides interesting customizations others harder implement. have been dreading decision test out last 48 hours. i'm hoping i'm making goofy mistake when test on local machine receive kinds of strange errors. instance, code in jsfiddle:
the form ignores validation , processes page form would. if remove success:"valid" selector, (or success: matter) page works should except form errors not removed when changed.
the js fiddle set above throws sorts of errors. instance, if hit submit once, errors thrown expected. however, if enter text in name field hit 'submit' again, form tries process (something should not occurr regardless due submithandler: in script.
does have guidance on these woes?
this how i've been using qtip2 on of sites. fussy working , required lot of assistance qtip developer. place qtip .destroy method within success callback function, not chained within errorplacement you've done.
$(document).ready(function () { $('#myform').validate({ rules: { // }, success: function (error) { settimeout(function () { // use mini timeout make sure tooltip rendred before hiding $('#myform').find('.valid').qtip('destroy'); }, 1); }, submithandler: function (form) { // ajax return false; }, errorplacement: function (error, element) { var cornersat = ['left center', 'top left'], // set positioning based on elements position in form cornersmy = ['right bottom', 'bottom right'], flipit = $(element).parents('div.left').length > 0, position = { at: cornersat[flipit ? 0 : 1], my: cornersmy[flipit ? 0 : 1] }, offset = flipit ? 6 : 35; $(element).filter(':not(.valid)').qtip({ // apply tooltip if isn't valid overwrite: false, content: error, position: position, show: { event: false, ready: true }, hide: false, style: { // make red... classic error colour! classes: 'ui-tooltip-error ui-tooltip-rounded', tip: { corner: true, offset: offset } } }).qtip('option', 'content.text', error); } // closes errorplacement }); // closes validate() }); for alternative jquery tooltip plugin, i've switched tooltipster, whole lot cleaner integrate jquery validate.
see answer demo: https://stackoverflow.com/a/14741689/594235
Comments
Post a Comment