Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    Regular Coder
    Join Date
    Aug 2013
    Posts
    141
    Thanks
    22
    Thanked 0 Times in 0 Posts

    form validation forename capital letter at start

    I am trying to validate a forename so that it has to have a capital letter at the start.



    This is my javascript function:



    function validateForename()
    {
    var the_input = document.getElementById)("Fname").value;
    if (!the_input.match(/^[A-Z]/)){
    alert('Forename must begin with a capital letter');
    return false;
    }else{
    return true;
    }
    }



    this is where I am calling the function:



    function validateForm()
    {
    var x=document.forms["custForm"]["fName"].value;
    if (x==null || x=="")
    {
    alert("Invalid Forename");
    return false;
    }

    var x=document.forms["custForm"]["sName"].value;
    if (x==null || x=="")
    {
    alert("Invalid Surname");
    return false;
    }

    validateForename(); <----------------------- here
    }



    and this is where I am calling the validate form function:



    <form name="custForm" action="action info here" onsubmit="return validateForm()" method="POST">





    Any help would be greatly appreciated thanks

  • #2
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,535
    Thanks
    45
    Thanked 259 Times in 256 Posts
    If this is a copy paste of your code, the bug is right here in the beginning.

    var the_input = document.getElementById)("Fname").value;

    Extra parens.

    Also, next time please use the code tags.
    Last edited by Keleth; 08-16-2013 at 04:36 PM.

  • #3
    Regular Coder
    Join Date
    Aug 2013
    Posts
    141
    Thanks
    22
    Thanked 0 Times in 0 Posts
    any suggestions????

  • #4
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,535
    Thanks
    45
    Thanked 259 Times in 256 Posts
    ... remove the extra parens?

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,909
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Rather than require the use to enter his name with an initial capital letter, (which means that PhILiP is ok) just rework the name in proper format:-

    Code:
    var str = "jEAn-paul o'flaNAGan-macDONald is a grEAT guy!"
    str = str.toLowerCase().replace(/\b[a-z]/g,function(w){return w.toUpperCase()});
    alert(str);
    if (x==null || x=="")

    A form field can never be null, only "" (blank).

    But form validation of the pattern if (document.formname.formfield.value == "") - that is blank - is barely worthy of the name, and virtually useless, as even a single space, an X or a ? will return false, that is pass the validation. A proper name may only contain letters, hyphen, space and apostrophe.
    Numeric values, such as zip codes, phone numbers and dates, should be validated as such. Ditto email addresses. This topic has been covered many times before in this forum.

    There's a certain inevitability about what we're seeing, but that, in view of the situation, is inevitable. - Commentator Radio 5 Live
    Last edited by Philip M; 08-16-2013 at 04:55 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,909
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Here is a script which comprehensively validates first and last names:-

    Code:
    <html>
    <head>
    </head>
    
    <body>
    
    <form  id = "myform" action="" onsubmit="return check(this)">
    <input id="firstname" name="firstname" type="text" value="First Name" onfocus="this.value==this.defaultValue?this.value='':null" onblur="this.value==''?this.value=this.defaultValue:null">
    <input id="lastname" name="lastname" type="text" value="Last Name" onfocus="this.value==this.defaultValue?this.value='':null" onblur="this.value==''?this.value=this.defaultValue:null">
    <br><br>
    <span id = "message" style = "color:red; font-size:9pt;  font-weight:bold;" > </span>
    <br><br>
    <input type="submit" value="Submit">
    </form>
    
    <script type = "text/javascript">
    
    function check(form) {
    document.getElementById("message").innerHTML = "";
    var fn = form.firstname;
    var fnv = form.firstname.value;
    fnv = fnv.replace(/\s+/g,"");  // strip all spaces OR
    //fnv = fnv.replace(/^\s+|\s+$/g,"");  // strip only leading and trailing spaces;
    //fnv = fnv.replace(/\s{2,}/g," ");  // Replace multiple spaces with one space
    // convert whatever is entered into lower case but with a capitalised first letter
    fnv = fnv.toLowerCase().replace(/\b[a-z]/g,function(w){return w.toUpperCase()});
    form.firstname.value = fnv;  // write it back to the field
    if ((fnv == "Firstname") || (fnv.length < 2) || (/[^a-z\-\']/gi.test(fnv))) {  // only a-z hyphen and apostophe allowed in proper name
    form.firstname.value= "";  // clear the invalid field
    var msg = "Invalid characters in first name or first name too short!  Please enter your first name!";
    document.getElementById("message").innerHTML = msg;
    myfield = fn;  // note myfield must be a global variable
    setTimeout('myfield.focus();myfield.select();' , 10);  // to overcome bug in Firefox
    return false;
    }
    
    var ln = form.lastname;
    var lnv = form.lastname.value;
    lnv = lnv.replace(/\s+/g,"");  // strip all spaces OR
    //lnv = lnv.replace(/^\s+|\s+$/g,"");  // strip only leading and trailing spaces;
    //lnv = lnv.replace(/\s{2,}/g," ");  // Replace multiple spaces with one space
    // convert whatever is entered into lower case but with a capitalised first letter
    lnv = lnv.toLowerCase().replace(/\b[a-z]/g,function(w){return w.toUpperCase()});
    form.lastname.value = lnv;  // write it back to the field
    if ((lnv == "Lastname") || (lnv.length < 3) || (/[^a-z\-\']/gi.test(lnv))) {  // only a-z hyphen and apostophe allowed in proper name
    form.lastname.value= "";  // clear the invalid field
    var msg = "Invalid characters in last name or last name too short!  Please enter your last name!";
    document.getElementById("message").innerHTML = msg;
    myfield = ln;  // note myfield must be a global variable
    setTimeout('myfield.focus();myfield.select();' , 10);  // to overcome bug in Firefox
    return false;
    }
    
    alert ("You entered " + fnv + " " + lnv);  // for testing
    return true;
    }
    
    </script>
    
    </body>
    </html>
    Note that alerts are obsolete - use DOM methods as above to display messages to your users.
    Last edited by Philip M; 08-16-2013 at 07:00 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #7
    Regular Coder
    Join Date
    Aug 2013
    Posts
    141
    Thanks
    22
    Thanked 0 Times in 0 Posts
    Thanks for the validation code works great appreciate it.

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    That script will fail on names with accents (e.g. ß, Ú, Ý, ˇ, ˙, Ř, etc.) and non-Roman alphabets (Chinese, Arabic, etc.) and mangle last names that start with small letters (de la Cruz)

    And the hint text on the fields (called placeholder) are natively supported in IE10+ and other modern browsers via the placeholder attribute:

    Code:
    <input id="firstname" name="firstname" type="text" placeholder="First Name" />
    <input id="lastname" name="lastname" type="text" placeholder="Last Name" />
    For IE9 and below, we can mimic the placeholder behavior like what Philip did.

  • #9
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,909
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by glenngv View Post
    That script will fail on names with accents (e.g. ß, Ú, Ý, ˇ, ˙, Ř, etc.) and non-Roman alphabets (Chinese, Arabic, etc.) and mangle last names that start with small letters (de la Cruz)

    And the hint text on the fields (called placeholder) are natively supported in IE10+ and other modern browsers via the placeholder attribute:

    Code:
    <input id="firstname" name="firstname" type="text" placeholder="First Name" />
    <input id="lastname" name="lastname" type="text" placeholder="Last Name" />
    For IE9 and below, we can mimic the placeholder behavior like what Philip did.

    Like many other validation sripts it is assumed that the names are English. If that assumption is invalid then obviously a different algorithm is needed. It is perfectly possible to prevent capitalisation of de, la, du, van, der and so on if you think that is worthwhile.

    Code:
    lowerc = ['De', 'La', 'Du', 'Von', 'Van', "Der", "Den",];  // name prefixes in lower case
    for (i = 0; i < lowerc.length; i++) {
    str1 = str1.replace(new RegExp('\\s' + lowerc[i] + '\\s', 'g'),  function(txt) { return txt.toLowerCase();  }); 
    }
    But such names are rare in English.

    I think we have already discussed MacDonald, MacLeod, Macnab and Mackenzie. They require special treatment if strict accuracy is required.
    Last edited by Philip M; 09-24-2013 at 08:57 PM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #10
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Quote Originally Posted by Philip M View Post
    I think we have already discussed MacDonald, MacLeod, Macnab and Mackenzie. They require special treatment if strict accuracy is required.
    Also names with Jr., Sr., II, III, etc...

  • #11
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,909
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by glenngv View Post
    Also names with Jr., Sr., II, III, etc...
    Yes, but those are Americanisms. Not found in proper English usage Jr. and Sr. are correctly rendered by my code (Jnr. and Snr. if used at all in the UK). But anyone who puts Jr. or III after his surname in a form is likely to create a database error as it alters the sort order. Or get letters addressed to "Dear Mr Iii".

    In any case I would take the view that Jr. Sr. III etc. are suffixes and not part of the person's name. Just like the prefixes Mr. Dr. or Lord.

    There is probably no limit to the number of possible daft names. I learn that there is a footballer named Cezaro Fung-A-Wing (which comes out correctly in my code). But I admit that the code is defeated by GaWiNi Pony Boy who I learn is a native American horse boffin once voted 'Most intriguing person of 2002'. But that is not in fact his real name.

    I have no idea whether proper names in non-Roman alphabets are "capitalised" (if that exists).
    Last edited by Philip M; 09-25-2013 at 09:13 AM.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #12
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,133
    Thanks
    75
    Thanked 4,338 Times in 4,304 Posts
    Heh! What about tossing in Japanese and Chinese while we are at it?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #13
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,037
    Thanks
    0
    Thanked 250 Times in 246 Posts
    Quote Originally Posted by Old Pedant View Post
    Heh! What about tossing in Japanese and Chinese while we are at it?
    I already mentioned that.
    That script will fail on names with accents (e.g. ß, Ú, Ý, ˇ, ˙, Ř, etc.) and non-Roman alphabets (Chinese, Arabic, etc.)

  • #14
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,909
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    The script will not "fail" but will not accept those accented characters. It would not be hard to modify the code to accept them if desired.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.


  •  

    Posting Permissions

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