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.
Solved
Is there a way to force a text field in forms to capitalize the first letter of the text?
+2Best answer by shirin
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
+4- Nintex Employee
- Answer
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
+11I tried this for all letters to be capital but it still does turns only the first letter to capital.
Any advise?
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?
+11This 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.
+11An 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.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.