Results 1 to 4 of 4

Thread: Little problem with this form

  1. #1
    Join Date
    Feb 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Little problem with this form

    I'm fairly new to JavaScript so Iím still trying to get my head around it and stuff, but Iíve managed to come up with a basic form with checks in place to validate the form when it is submitted. Iíve managed to get everything working except for one of the input fields which are the UK post code field. Iíve found an expression for the UK post code but Iím having difficulty with implementing it correctly so it displays the alert when the user enters there Postcode in an incorrect format. Iíve placed all of the forms checks inside one function which validates the form, if somebody could help me out with this post code issue that would be great!

    Here's the JavaScript Iím stuck with;

    Code:
    // Check for revising wherever the inputted data is in the correct format e.g. UK Post Code //NEED HELP WITH THIS ONE
    var regPostcode = /^([a-zA-Z]){1}([0-9][0-9]|[0-9]|[a-zA-Z][0-9][a-zA-Z]|[a-zA-Z][0-9][0-9]|[a-zA-Z][0-9]){1}([ ])([0-9][a-zA-z][a-zA-z]){1}$/;
    if(regPostcode.test(postcode) == false)
      {
      alert("Your Post Code is in the wrong format");
      contactform.postcode.focus();
      return false;
      }
    Here is the HTML form field associated with it;

    Code:
    <div class=Ēfield_containerĒ><label>Post Code</label><input type=ĒtextĒ name="postcode" id="postcode" /></div>
    Last edited by EpiGamer; 02-19-2012 at 12:07 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,069
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    First off and this may or may not be a problem in some browsers, the use of left and right quotes (you only have left ones or right here):

    Code:
    <div class=field_container><label>Post Code</label><input type=text
    is generally invalid. They should be " symbols instead.

    I'm ignorant of what constitutes a valid UK postal code. However, the regular expression in your post has an obvious logical flaw at the end:

    Code:
    [a-zA-z][a-zA-z]
    I'm almost certain these were meant to mean all upper and lower case letters like the others:

    Code:
    [a-zA-Z]
    so that could esily be the problem or at least a part of it.

    Also, [0-9] means the same as \d. And letters may be flagged as case insensitive with the i switch at the end of the expression. Additionally ([ ]) means the same as ( ), and the use of {1}, which means one and only one time is the default, so is unnecessary.

    With all that in mind, the entire expression can be considerably shortened to*:

    Code:
    /^([a-z])(\d\d|\d|[a-z]\d[a-z]|[a-z]\d\d|[a-z]\d)( )(\d[a-z][a-z])$/i
    Oh, and:

    Code:
    if(!regPostcode.test(postcode))
    is the same as:

    Code:
    if(regPostcode.test(postcode) == false)
    So you would have:

    Code:
    // Check for revising wherever the inputted data is in the correct format e.g. UK Post Code //NEED HELP WITH THIS ONE
    var regPostcode = /^([a-z])(\d\d|\d|[a-z]\d[a-z]|[a-z]\d\d|[a-z]\d)( )(\d[a-z][a-z])$/i;
    if(!regPostcode.test(postcode))
      {
      alert("Your Post Code is in the wrong format");
      contactform.postcode.focus();
      return false;
      }
    If that doesn't take care of the problem, let me know - and tell me the criteria for a valid UK postal code. A link to your page would be a great help.

    One other thing. regPostcode.test(postcode) doesn't tell us whether or not postcode has been properly defined elsewhere as the value of the postcode input. If it hasn't, then most likely it will always fail the test.

    Here's a working demo that includes an example of the shortest and the longest code that would fit the criteria, which are outlined in plain words:

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
    // Check for revising wherever the inputted data is in the correct format e.g. UK Post Code //NEED HELP WITH THIS ONE
    function cpc(){
    var regPostcode = /^([a-z])(\d\d|\d|[a-z]\d[a-z]|[a-z]\d\d|[a-z]\d)( )(\d[a-z][a-z])$/i;
    if(!regPostcode.test(document.getElementById('postcode').value))
      {
      alert("Your Post Code is in the wrong format");
      document.getElementById('postcode').focus();
      return false;
      }
     }
    </script>
    </head>
    <body>
    <div class="field_container"><label>Post Code</label><input type="text" name="postcode" id="postcode" /></div>
    <input type="button" value="Check Code" onclick="cpc();">
    <br>shortest valid code: 'a1 1aa'
    <br>longest valid code: 'aa1a 1aa'
    
    <div>Criteria</div>
    <pre>one letter followed by:
    
    a. one or two numbers
    
    or
    
    b. one letter one number one letter
    
    or
    
    c. one letter and two numbers
    
    or
    
    d. one letter and one number
    
    followed by:
    
    a space one number and two letters.</pre>
    </body>
    </html>

    *a little more shortening is possible.
    Last edited by jscheuer1; 02-19-2012 at 02:02 AM. Reason: add demo
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Feb 2012
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks a lot for the response, I figured out from your post that I wasn't defining where the postcode value was being entered meaning there was no link between the field and the function script. I also changed the expression to what you suggested, all is good and working now, thanks!

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,069
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Great! However, I just checked the Royal Mail website and the say the definition for a postal code is different:

    What is a postcode?

    A postcode is a group of numbers and letters that give precise and essential information about a mail item’s destination. It’s made up of several parts, each of which provides us with specific information.

    Example: SO31 4NG
    This breaks down as follows:
    Outward Code: SO31
    SO = the postcode area. One or two letters identify the main office the mail initially goes to.
    31 = the postcode District. One or two characters, numeric except, occasionally, in central London. This helps to sort the item at the main office.

    Inward Code: 4NG
    4 = the Sector. A number defining a neighbourhood within a district.
    NG = the Unit code. Two letters that identify a group of approximately 15 addresses.

    Please make sure you use full, correct postcodes. The Postcode Finder is designed to help you do this.
    So theirs is a little more restrictive. With them all codes must begin with two letters followed by one or two letters or numbers, a space, a number, two letters. It's not so bad though, any code that will satisfy the Royal Mail's criteria will also satisfy that setup by the regular expression. However, the regular expression will allow some codes that are not allowed by the Royal Mail's own definition. They should know, though I guess it's possible they've not articulated it properly.

    In any case, according to their definition it should be:

    Code:
    /^[a-z]{2}[\da-z]{1,2} \d[a-z]{2}$/i
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •