Grow your CSS skills. Land your dream job.

How can form input value be cleared before validation?

  • # December 22, 2012 at 10:44 pm

    I want to have input fields with a value inside of the field. But, the initial value needs to be cleared prior to validation or the initial field value is submitted.

    [In example](http://codepen.io/joe/pen/meokF “CodePen”) – the first field (Name) validates even if submit is clicked without changing value.

    I’m using jQuery Validate plugin to perform validation.

    Thank you,
    Charlie

    __
    # December 22, 2012 at 10:55 pm

    a better solution is to use the `placeholder` attribute:

    but it you’re looking for compatibility with older browsers, you can simply check the value and make sure it’s different. If you’re using [Validation](http://docs.jquery.com/Plugins/Validation), you can make a custom rule as part of your validation.

    # December 22, 2012 at 11:28 pm

    I ran into that same problem. This was the only one I was able to find that solved it. http://www.visibilityinherit.com/code/jquery-infieldlabel.php

    # December 23, 2012 at 10:47 am

    Thank you. I think both ideas can work.

    1. Custom Validation Rule: Can a rule be created that would do something like this… IF the field value is “Name*” THEN do NOT validate IF the field value is “just about anything else more than two characters” THEN validate. (Can anyone offer a the jQuery for this?)

    2. In Field Label: Great idea! Just use the LABEL tag and position it with CSS directly over the field so it looks like a field value. Why didn’t I think of that!

    Thank you!
    Charlie

    # December 23, 2012 at 11:05 am

    Ya you can. Off memory I think it’s called a regex. If this plugin http://www.visibilityinherit.com/code/jquery-validation.php doesn’t have that already built in then you’ll have to write one. At the bottom it explains how. I would maybe post it over at webmasterworld as they are pretty good with regex stuff.

    __
    # December 23, 2012 at 2:04 pm

    > …IF the field value is “Name*” THEN do NOT validate IF the field value is “just about anything else more than two characters” THEN validate. (Can anyone offer a the jQuery for this?)

    I don’t know specifically, but `$.validator.addMethod` allows you to define custom validation functions. Just start with a check against the value. I’m busy at the moment but I’ll take a look when I get a chance.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".