SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Zealot
    Join Date
    Jul 2007
    Posts
    170
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Jquery Extend validation

    Hi, I am trying to add extra validation checks on an existing javascript code but I was hoping i can do this without changing the old codes. For example:

    Old code:
    PHP Code:
    $(".sendMessage").live("click", function( ) {
            var 
    subject = $.trim( $("#subject").val( ) );

            if( 
    subject == "" ) {
                
    alert"No subject added" );
                return 
    false;
            }
            return 
    false;
        }); 
    Would like to add in/extend the sendMessage with extra check so as it becomes:

    PHP Code:
    $(".sendMessage").live("click", function( ) {
            var 
    subject = $.trim( $("#subject").val( ) );
            var 
    content = $.trim( $("#textArea").val( ) );

            if( 
    subject == "" && content == "" ) { // new validation
                
    alert"No subject and content added" );
                return 
    false;
            }
            return 
    false;
        }); 
    Is there a proper way to do this?
    I Dunno LOL \(_o)/

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,729
    Mentioned
    104 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by justspree View Post
    Hi, I am trying to add extra validation checks on an existing javascript code but I was hoping i can do this without changing the old codes.
    jQuery does have a validation plugin that allows you to update the form without needing to change the scripting code.

    For example, if you have a form element that's required, with a minimum length of 2 characters, you could then do it with:

    Code html4strict:
    <input id="firstname" name="firstname" class="required" minlength="2">

    Or, you can do similar without using scripting at all, by making use of HTML5 techniques.

    HTML Code:
    <!doctype html>
    ...
    <input id="firstname" name="firstname" required>
    But because screen readers have a difficult time, we really should add a WAI-ARIA role to help them out too.

    HTML Code:
    <!doctype html>
    ...
    <input id="firstname" name="firstname" required="true" aria-required="true">
    You can also style your HTML5 required elements and whether they are valid or invalid with:

    Code css:
    input:required {
        background-image: url('/images/required.png');
    }
    input:focus:invalid {
        background-image: url('/images/invalid.png');
    }
    input:focus:valid {
        background-image: url('/images/valid.png');
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •