validation - jquery tooltip to display validator messages not changing back to invalid -



validation - jquery tooltip to display validator messages not changing back to invalid -

i have implemented popular solution article (jquery tooltip display validator messages) part working brilliantly - unless alter input after been flagged success...

so here happens on form submission (with errors): 1. invalid fields correctly shown error. good. 2. come in text field, div updates include 'checked' class , image changes. good. 3. remove text in order create error again. still shows success. bad. heres code: js file

$.validator.setdefaults( { invalidhandler: function(){ toggletopmessagebox('error') }, submithandler: function() { toggletopmessagebox() document.frmtransaction.hidsubmitform.value='submit'; document.frmtransaction.submit(); }, success: function(element) { $(element).addclass("checked"); }, errorplacement: function(error, element) { var container = $('<div />'); container.addclass('inlinevalidation'); // add together class wrapper error.insertafter(element); error.wrap(container); $("<div class='errorimage'></div>").insertafter(error); }, ignore: ":hidden:not(select)" });

css

div.inlinevalidation { position: relative !important; display: inline-block; top: -2px; } div.inlinevalidation:hover { z-index:1005; } div.inlinevalidation label { display: none !important; vertical-align: middle; } div.inlinevalidation:hover label.error:not(.checked) { display: inline-block !important; position: absolute; left:30px; width:150; padding:5px; background-color: #e96d63; border: 3px #e96d63 solid; border-radius: 0.5em; color: white; opacity: 0.85; } label.error + div.errorimage { background:url("images/error_22x22.png") no-repeat 0px 0px; margin:4px; display:inline-block !important; width:22px; height:22px; vertical-align: middle; } label.checked + div.errorimage { background:url("images/success_22x22.png") no-repeat 0px 0px; margin:4px; display:inline-block !important; width:22px; height:22px; vertical-align: middle; }

if alter errorplacement

errorplacement: function(error,element){ error.insertafter(element); },

then behaves correctly, of course of study i've lost div formatting / wrapper. have tried adding element.removeclass("checked") not seem create difference.

tried post pics help, i've got no rep beingness newbie.

anyway, in advance has suggestions me, much appreciated.

jp

jquery validation

Comments

Popular posts from this blog

php - Android app custom user registration and login with cookie using facebook sdk -

django - Access session in user model .save() -

php - .htaccess Multiple Rewrite Rules / Prioritizing -