What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    How to capitalize the first letter of the text field?

    Asked by oxinst on March 20, 2014 at 04:09 AM

    Hi

    I have a sinlge line text field for a 'Full Name', is there anyway that I can force or automatically format the data entered so the the first letter of each word is a Uppercase letter e.g. Xxxxxx Xxxxxx (obviously the number of characters in each word could vary).

    Thanks

    Page URL:
    http://www.oxford-instruments.com/investors

    text field name format thanks
  • Profile Image

    Answered by jedcadorna on March 20, 2014 at 07:36 AM

    Yes that is possible by injecting a custom CSS. Please use this CSS code:

    #input_1{text-transform:capitalize;}

  • Profile Image

    Answered by oxinst on March 20, 2014 at 12:17 PM

    @jedcadorna thanks for the reply.  And that does work, however this only forces the text to display like this, the data that is acutually passed through to the backend, is still in the original format.  Any ideas on how to get the original data to pass through to the backend in the correct format.

    Thanks

  • Profile Image
    JotForm Support

    Answered by KadeJM on March 20, 2014 at 03:07 PM

    It sounds like you are seeking some sort of method to reformat everything into a " Proper Format " per say if I'm not mistaken. For instance someone types in their name in all lowercase because they're in a hurry and you want to force it to look a little more appropriate I imagine.

    I think you may be trying to achieve something like this for example:

    (which would then carry over into the backend) Is this maybe kinda what you are asking for?

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Capitalizing first letter in a textbox</title> <script type="text/javascript"> function capitalize(textboxid, str) { // string with alteast one character if (str && str.length >= 1) { var firstChar = str.charAt(0); var remainingStr = str.slice(1); str = firstChar.toUpperCase() + remainingStr; } document.getElementById(textboxid).value = str; } </script> <body> <form name="myform" method="post"> <input type="text" id="mytextbox" onkeyup="javascript:capitalize(this.id, this.value);"> </form> </body> </html>

    You can copy and paste it here - http://htmledit.squarefree.com/ - to test this as live code if you want.

    The only problem is that the javascript currently interferes with the form's own javascript function so that's not possible unless you do it with the form's source code and even then I think it would likely be a problem running through the form when submitted to the backend since it runs within that. 

    Please confirm or correct me if I've gone offtrack and if so I do apologize.

  • Profile Image

    Answered by Jovier Mark  on May 27, 2015 at 02:00 AM

    try this Javascript ...

     

    function titleCaseReg(inStr)
    {
     retrun inStr.replace(/^[a-z]/,function(str)
     {
      retrun str.toUpperCase()
     });
    }

    Full Source......Capitalize the first character of all words

     

    Mark