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

    I need all input fields to be in uppercase

    Asked by detlondon on November 08, 2015 at 09:42 AM

    I have been unable to correctly update my form so that all feilds completed are in uppercase.  Is this something you can help with?  My URL is https://form.jotformeu.com/52793291321354

    all input fields style size height font text uppercase input CSS text-transform
  • Profile Image
    JotForm Support

    Answered by Mike_G on November 08, 2015 at 11:33 AM

    You can do that by adding CSS codes to your form, you may click the link to learn How-to-Inject-Custom-CSS-Codes

    input {

    text-transform: uppercase !important;

    }


    Once you done that every text typed on your every input field on your form will be on uppercase even without capslock turned ON.

    Here's the form I have used for testing: https://form.jotform.com/53114890483962.

    Feel free to open it and check.

    I hope this helps. If you need any further assistance, please let us know anytime and we will be glad to help you. Thank you.

  • Profile Image

    Answered by grade4pagasa on November 08, 2015 at 12:40 PM

    Hi Mike_G.

    Being curious and always trying new things learned in JotForm, I tried the Uppercase script in css and it worked. All entries I did were turned to uppercase. Only drawback is it only works when inside the browser. When I checked my email, all entries were in lowercase. 
     
    Then I did some searching in the forum and found JotForm Support Ben's solution - to manipulate the email notification and apply the uppercase script on individual fields. And this time the email showed all entries in uppercase. 
     
    - Randy, JotForm user.
     
     
  • Profile Image
    JotForm Support

    Answered by Mike_G on November 08, 2015 at 01:05 PM

    @grade4pagasa

    Thank you so much for your input.

    Yes, that is correct, the CSS codes I have indicated above will only work for the input fields on the form in a browser and not with the data in the email notification since it is added to the Inject Custom CSS of the form only.

    Also, thank you for sharing the link to Ben's answer, that would be helpful if @detlondon would want to make the data in the email notification in uppercase too. By manipulating the Source Code of the email notification data, you can add the same CSS codes(text-transform: uppercase !important;) to the "style" attribute of the <span> tag that contains/holds  the field name of the fields.

    Cheers!

  • Profile Image

    Answered by grade4pagasa on November 08, 2015 at 01:13 PM

     

    Follow up. Inquisitive mode again 😀
    We can guess that the reason why the original poster is requesting for an all uppercase entries for his input fields / textbox is because he's also expecting the same results to be reflected as uppercase in the database / submission, right? 
     
    I just checked the submission page and all entries are in lowercase. I'm inclined to think that the uppercase style is only applicable when being viewed in the browser & email but not on JotForm's server where the submissions are stored?
     
  • Profile Image
    JotForm Support

    Answered by Mike_G on November 08, 2015 at 02:01 PM

    @grade4pagasa

    You are correct. The CSS codes added to make the texts in the input boxes uppercase will not affect the data or string being passed to our database. The CSS codes are just used to style (front end) and not affect the data being passed. I think, if you really want the text being passed to the submission page to appear upper-cased, you will need to use scripts(Javascript) and apply it to the form's source code. 

    http://www.w3schools.com/jsref/jsref_touppercase.asp

    Just to add, in the email notification data, aside from adding the CSS codes to the "style" attribute of the <span> tag, you can also do this (Please see image below)

  • Profile Image
    JotForm Support

    Answered by abajan on November 08, 2015 at 06:16 PM

    The information provided in this thread may also be helpful.

    Thanks

  • Profile Image

    Answered by grade4pagasa on November 09, 2015 at 12:05 AM

    Hi JotForm Support team !

    Just a thought. Maybe it would be nice to include in the input field (textbox) parameters an option for different cases like the one offered in the Random Value Generator? 

    I understand that even if this was raised as a feature request to the Dev. Team does not mean that it will be added soon or be made at all. 

    - Randy