i want to make the value of a textbox in a form always in uppercase and i use this code
<tr>
<td width=70>No. Polisi</td>
<td width=10>:</td>
<td width=30>
<input type="text" id="nopol" type="text" name="nopol" maxlength="10" size="26" style="text-transform:uppercase" /> </td>
<td width=1></td>
</tr>
but when i click the submit button, the textbox that i give that code for the uppercase text. the data that i get from that textbox is change into lowercase (inside of my database)
In the front-end you use css to target the input type text and use text-transform to uppercase : below is a working fiddle.
input[type="text"]{
text-transform : uppercase
}<form action="">
<input type="text" id="nopol" type="text" name="nopol" maxlength="10" size="26">
<input type="submit" name="submit" formmethod="POST">
</form>Then in your server side use php's strtoupper() function to convert the text to uppercase
<?php
if(isset($_POST['submit'])){
$nopol = strtoupper($_POST['nopol']);
echo $nopol;
}
?>
</div>
add your html
<input id="nopol" type="text" name="nopol" maxlength="10" size="26" style="text-transform:uppercase" onkeydown="upperCaseF(this)"/>
add your javascript
function upperCaseF(a){
setTimeout(function(){
a.value = a.value.toUpperCase();
}, 1);
}
text-transform: uppercase is css property. It only affects the user display. To convert it into uppercase use javascript or jquery
<table>
<tr>
<td width=70>No. Polisi</td>
<td width=10>:</td>
<td width=30>
<input type="text" id="nopol" type="text" name="nopol" maxlength="10" size="26" style="text-transform:uppercase" /> </td>
<td width=1></td>
</tr>
<tr>
<td>
<input type="submit" value="submit"/ onclick="getValue()">
</td>
</tr>
</table>
Write the javascript function
function getValue() {
alert(document.getElementById('nopol').value.toUpperCase());
}
Using
style="text-transform:uppercase"
does a visual transformation only. Your actual input will retain the format you entered. You have to convert to UPPER after you post the data to your server in order to save it in Uppercase.