WordPress.org

Ready to get started?Download WordPress

Forums

Highlighting required fields (5 posts)

  1. marzar00
    Member
    Posted 10 years ago #

    Does anyone know how to do this? What I mean is that if someone fills out a form and miss a required field it highlights when they click submit.
    Any help is much apperciated!
    Regards
    Marzar

  2. Ozh
    Member
    Posted 10 years ago #

    I think a quick googlage with keywords such as "javascript validate form" will lead you to plenty of javascript ready for use.

  3. MaxT
    Member
    Posted 10 years ago #

    That can be also done with PHP if you hate JS (as well as I do even after I *have* to use it some places). VDeamon is very powerfull PHP library to check any form you want, be it mail field, date field with special formatting, url etc. And you you free to sit down and make sure your JS expressions will work as they are intended.
    http://www.MaxT.dk

  4. Ozh
    Member
    Posted 10 years ago #

    I'm not too fond of javascript, but form a user's POV it's often better to process a few tests client-side rather than server-side. Like, I really hate to submit a form, wait 5 seconds on a slow server, then get a message telling me to fill this or that (and occasionnaly lose all other fields data in a failed page refresh :)

    Anyway, here is a way to "highlight" a missing mandatory input. I finally did it because it has turned as a challenge for me when I couldnt tell why my first try wasnt working :)

    <script language="JavaScript">
    <!--
    function isValid(thing) {
    email=thing.my_field.value;
    alert (email);
    if (email=="") {
    // the form is not ok
    // you could also add : alert ('this is a mandatory value');
    thing.getElementsByTagName("label")[0].style.color = "red";
    alert ('oh');
    return false;
    } else {
    // the form is ok
    thing.submit();
    return true;
    }
    }
    //-->
    </script>
    <form name="my_form" id="my_form" method="post" action="yourpage.php">
    <label id="my_label" name="my_label" for="my_field">Mandatory value:</label>
    <input type="text" id="my_field" />
    <input type="button" onClick="return isValid(this.form)" value="Ok" />
    </form>

  5. marzar00
    Member
    Posted 10 years ago #

    Where's the javascript bit??? Otherwise it looks like it will work!
    Regards
    Marzar

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.