This tutorial will teach us to convert the string into the upper case touppercase(). In many governments, websites users have seen while filling forms, characters are automatically converted into upper case to avoid any mistakes.
It needs to do because JavaScript is a case-sensitive language, and if the user adds some characters in lower case and some in upper case, it can mismatch with the string stored in the database.
To get accurate data from the user, it is needful to convert the string to uppercase.
Hey there, it’s your friendly neighborhood computer engineer, Vinit Pandey! I’m the mastermind behind smmwizardpro.com and edu4maharashtra.in – websites so cool they’ll make your head spin. And if you’re not following me on Instagram at vinit.bro, well, let’s say I am missing you their.
So if you want to level up your tech game, just hit me up. I promise I won’t bite – unless you’re a computer virus, in which case I’ll destroy you faster than you can say “blue screen of death.”
Using the String toUpperCase() Method
We can use the String toUpperCase() and toLowerCase() methods to convert all string characters into the upper case and lower case. It is the JavaScript built-in string library method that we can apply only to the string.
If users want to apply the toUpperCase() method on the variable with other data types, they need to convert it into a string.
For example, to apply the toUpperCase() method on the date string, users need to convert it into the string using the toString() method.
Example
In the below example, we have created the toUpperCase() and toLowerCase() string methods to convert the string to upper case and lower case.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body bgcolor="#6600ff"><center>
<h1 style="color:white"> Hello! my name is Vinit Pandey</h1>
<form name="form1">
<h2 style="color:white"> Enter Data</h2><input type="text" name="data1">
<p><input type="button" value="Change To UpperCase" name="upperbotton" onclick="convertCase('upper')" style="background-color:red; border-color:blue; color:white"><br><br>
<input type="button" value="Change To LowerCase" name="lowerbotton" onclick="convertCase('lower')" style="background-color:red; border-color:blue; color:white"><br>
</form>
</center>
<script>
function convertCase(changeCase) {
if (changeCase == "upper") {
document.form1.data1.value = document.form1.data1.value.toUpperCase()
}
else {
document.form1.data1.value = document.form1.data1.value.toLowerCase()
}
}
</script>
</body>
</html>
I hope you like my work please share with your friends with the options given below and If you have a problem comment below