Capitalize field to all caps on submission

[roattw]

Greetings

I followed the instructions on this older post.  The CSS style inclusion converts text in field to caps.  But the capital letters don't appear in table as caps on when submitted with submission form.

If I type lowercase letters in field, the CSS displays it as caps, but the data submitted to the table remains its typed in lowercase.

https://forums.caspio.com/topic/5600-capitalizing-all-letters/

Not sure whats different about my form.

Field is Trial_acronym

Code in footer:

<script type="text/javascript">
function capitalize()
{
var fieldname = "Trial_acronym";
fieldname = "InsertRecord"+fieldname;
confirmname = fieldname+"@Confirm";

document.getElementById(fieldname).value = document.getElementById(fieldname).value.toUpperCase();
document.getElementById(confirmname).value = document.getElementById(confirmname).value.toUpperCase();
}
document.getElementById('caspioform').onsubmit=capitalize;
</script>

 

[roattw]

Followup.  The code in my original post did not work.  However, this version did:

<script>
document.addEventListener('DataPageReady', upperCaseHandler);

const ids = '#InsertRecordFieldOneName, #InsertRecordFieldTwoName, #InsertRecordFieldThreeName'; //replace with your local field names

function upperCaseHandler() {

	document.querySelectorAll(ids).forEach(element => element.addEventListener('change', (event) => {
		element.value = element.value.toUpperCase();
	}))
};
</script>