Try this two forms. Both force letter case, but only one of them will send to the server exactly what you see (in terms of lower and upper case).

See? Now, let me explain what just happen and how to avoid the first situation.

Explanation

In each form we just force letter casing by using CSS. In this case, inputs with the “upper” class will be upper cased and those with the “lower” class will be lower cased.

The problem is that we get only the impression of lower and/or upper case, but we will actually send data cased as the user has entered. This means that even when you see “ABCD” you could actually receive “aBCd” at the server. I know, is not a big deal since you can (and should) force casing at server side, but sometimes you just want to be sure that your data is sent with the propper format.

A solution

So, how to solve this? jQuery (jQuery makes this easier, but you can use plain JavaScript too). You just need to add this code (plus the previous CSS one) to intercept any form submit, force propper and effective data casing and then continue with the sumbit process.

Simple, but useful in case you are working with casing.