Question

I don’t know what I’m doing wrong but basically this is what I have.

JQuery:

$(document).ready(function(){
 $('form#status_form').submit(function(){ 
         var statusV = $('input#status_updated2').val();
         if(statusV.length > 255)
         {
         $('em#statusError').fadeIn().fadeOut(5000);
         }
         else
         {
        //do cool stuff

        }
    }); 
});

The HTML form that it’s pulling from:

<em style="display:none;"id="statusError">*NO MORE THAN 255 CHARACTERS</em>
<form id="status_form" name="status_form">
<input type="text" id="status_updated2"  size="57" />
</form>

If I enter way more that 255 characters the error message won’t come up like it should and the fnctions in the “else” statement go through. What am I missing?

Answer 1

The reason you’re not seeing the message is that you’re not preventing the default action (form submission) from occurring if there’s an error. You can stop this like so:

$(document).ready(function(){
     $('form#status_form').submit(function(event){ 
         var statusV = $('input#status_updated2').val();
         if(statusV.length > 255)
         {
             event.preventDefault(); // stop the form submitting if there's an error.
             $('em#statusError').fadeIn().fadeOut(5000);
         }
         else
         {
            //do cool stuff
         }
     }); 
});

See the jsfiddle here for a working example.