Forums

Link to my form

How can I change to use both upper and lower cases in the form field input?

Hello gabi,
I'm not a Chrono professional, but after checking your new post, I think that the following links may help:
How to post information from a Chronoform to ZoHo
What are the 'Easy Form' and 'Form' Wizards?
How can I add a mask to format a form input?
How can I automatically copy fields from one part of my form to another?
P.S: I'm just an automated service😉

Hello Gabi
This is a CSS rule in your template's bootstrap.css file.
This is the file you need to change or create an override rule in your custom.css file.
**YOUR DOMAIN**/templates/yoo_avanti/styles/urban/css/bootstrap.css

It's in line: 7392

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
text-transform: uppercase;}

Hmm. Thought of something like that but I am not an expert in coding CSS.

I now did like this but its not working. I guess I did it wrong somehow.
In my custom CSS file I put this:

.uneditable-input {
/* Reset */
box-shadow: none;
/* Overrides */
height: 22px;
line-height: 22px;
color: #696862;
position: relative;
border-radius: 0;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 11px;
font-weight: inherit;
letter-spacing: 2px;
}

I simply removed the line:
text-transform: uppercase;

Can you tell me what I did wrong?

Hello Gabi
Removing the rule will not deactivate it, it will still be loaded from the first position.
You have to override the rule in your case you should add:

text-transform: none;

* you also do not have to write all the other css rules just the one you want to change.

Just changed the code in custom CSS to this, but also not working

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
box-shadow: none;
height: 22px;
line-height: 22px;
color: #696862;
position: relative;
border-radius: 0;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 11px;
font-weight: inherit;
letter-spacing: 2px;
}

Ahh nice. Got it.

In my custom CSS I changed the line to:
text-transform: none !important;

Thank you so much for your help

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
box-shadow: none;
height: 22px;
line-height: 22px;
color: #696862;
position: relative;
border-radius: 0;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 11px;
font-weight: inherit;
text-transform: none !important;
letter-spacing: 2px;
}

Thanks again.
As you can see above, this was the last try I did, and it worked.

I put all the rules in my Custom CSS, then I better remember and know what it means🙂

is there a way to make only specific form fields within a form force uppercase format in results form sent as email? For example my first, last name fields. I only want Last name to always be upper case whether the user enters lowercase name. Thanks

Hello amheng5,
You can make any input field accept only uppercase characters.
​
Add a class to any input that you want it to have only uppercase. Lets call the class uppercase_fields
Add the following css to your css file:[pre]input.uppercase_fields{
text-transform: uppercase;[br]}[/pre]
Now that field will accept only uppercase characters and therefore send the results in uppercase.[br]

Ok, so here's my code for email message and TCPDF code

<td class="uppercase_fields" align="left" valign="top" width="70%">{data:last_name}</td>
​
I entered in my css file:
​
input.uppercase_fields{ text-transform: uppercase;}

but results don't make last name Uppercase. Please let me know where I need to correct the code. Thanks

In the Designer tab 1 click Edit 2 of the field that you want to set as uppercase, click Advanced 3 and add your class there in the Container class 4 (see image).
​

​
Also change your css to the following

.uppercase_fields input{ 
    text-transform: uppercase;
}

Ok success, I got the field to convert to Upper case upon entry of last name. I also want to have the appearance of the label to be the same as the other fields, but I can't figure this out either.


and I ended up embedding code inside email section for the email message results to appear uppercase for last name.


but I also have TCPDF that I want the Last name to be transform to upper case too. However, it does not transform. I tried to embed the font code inside the TCPDF edit screen, but no luck. Can this be possible to force uppercase format in TCPDF files I send as attachments in email?
​
And finally I want to save the Last Name field in uppercase format in the database. But can't seem to get this done. I've tried entering in Extra attribute field but no luck.

​
Thanks

Hello amheng5,
On the "label to be the same as the other fields" issue i would guess that all the other fields are required and that one is not, so try that.
​
Did you do it the way i told you or in some other way?
Setting the field input provided by the user as uppercase should work for all cases Email, PDF and Database without the need of the "embedding code inside email section".
When the user writes his last name in uppercase it will be kept and handled that way.
Do you have a link of the form?

yes I did your suggestion, but the results were that the email message did not reflect uppercase last name nor did the TCPDF file did not reflect the uppercase last name which is my ultimate goal. Showing the uppercase as the last name is filled in on the form is fine but not the end result which is the appearance in the confirmation email to user or the TCPDF file.
​
here link....using basic contact form
https://meet-international.org/basic-contact-form.html

Hi amheng5,
​
I think that you need to use the PHP strtoupper() function in a Custom Code action before the Email and TCPDF actions to format the submitted value.
​
Bob

No luck...uppercase not showing in either my TCPDF or email message

​
Here's my custom code (not experienced in PHP 😟 )

​

​
Please advise where my error is.
Thanks

Hi amheng5,
​
Please see page 34 of the manual for the code to use with PHP. It will be something like this:

$temp = $this->data('last_name', '');
$temp = strtoupper($temp);
$this->data('last_name', $temp, true);

Bob

Thanks Bob i also had trouble with the correct syntax.

Really trying to get coding correctly. This is not working yet. I've placed this code under load tab 1st position.

​
$temp = $this->data('last_name', '');
$temp = strtoupper($temp);
$this->data('last_name', $temp, true);
$this->get($temp);
return ($temp);
​
No uppercase last name is being saved in database or appearing in email or TCPDF.
​
Really appreciate your patience in helping me.

I think I finally figured out the php code and I get the results I want in both the TCPDF & email message. Here's my code.

$temp = $this->data('last_name','');
$temp = strtoupper($temp);
$this->data('last_name', $temp, true);
echo file_get_contents($temp);

I placed after Verify data, catpcha but before "Save Database" sections.

Hi amheng5,
​
The last line should not be needed, the thee lines I posted should change the last_name to be uppercase. You can add a Debugger action to check that is working.
​
Bob