I have a form with two text fields,(first name/last name). I would like the forms to format those fields with the first letter entered as a capital.
Best answer by shirin
View original
Is there a way to force a text field in forms to capitalize the first letter of the text?
+2
+4
You can achieve this by using custom css. please look at below step.
- Add custom CSS into Form Settings.
- Click on Settings button on form designer
- Expand Custom CSS
- add new style like this: .transformToCapital {text-transform: capitalize;}
- Click Save
- Open Textbox control settings and expand Formatting
- Add Control CSS class value >> transformToCapital
- Publish form and it should work
Please let me know if it doesn't work.
Thanks,
Shirin
+2
Thank you for this solution. Works great!!
+11
I thought the same thing!
+11
Thank you very much. Very useful. I also used this method for transformToUppercase.
+11
I tried this for all letters to be capital but it still does turns only the first letter to capital.
Any advise?
+11
UPDATE:
.transformToCapital {text-transform: uppercase;}
This worked great for the form. My issue is it is not pushing all caps to the SP list. However when I view the form everything is in caps.
Any advice?
+11
This is only doable in one of the following ways:
- create an extra field and use the calculated value =UPPER([columnName])
- create a workflow that updates the text to capital
For example you got a field named "Username" and you want that to be uppercase in SP list.
create a new field and name it "ucUsername" (as in uppercaseUsername) and tick the Calculated Value option in default value
then finally click the Column Validation and enter =UPPER([Username])
Much appreciated! This is what i conceptually thought I'd have to do. Was hoping for an easier way.
+11
An alternative would be using JavaScript to update the TextField:
NWF$(document).ready(function () {
NWF$("#" + txtFirstName).change(function () {
// get the text value from the FirstNname textfield
var textContent = this.value; //alert(textContent)
// check to see if the value is not null
if (textContent.length > 0) {
// format the first letter to UpperCase and the rest to LowerCase
textContent = textContent[0].toUpperCase() + textContent.substr(1).toLowerCase();
this.value = textContent;
}
});
});In this case, the textField has got jS ID: txtFirstName
However, what if I wanted same approach for txtLastName and txtEmail.
How would I next this within one JavaScript code instead of having to replicate the above but just changhing the +txtName. Would appreciate your feedback and approvement on the above.
Reply
View our Community Site Map
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.