// Hi! first post here. I searched 'textTransform' and didn't get any results, so here's the new post

A'ight - I have successfully transformed text
document.getElementById(tgt.id).style.textTransfor m="capitalize";
as part of a function triggered by an onblur event
onblur="checkcase(this)"
This changes the value of an input box from lower to Sentence case
jason => Jason
But it's not really changed... It just looks like it's changed.
By that I mean:
1) the client-side javascript function will continue to read 'jason' rather than 'Jason' even after the transform (confirmed with an alert box for the value)
2) the server-side PhP email to which the form sends data (by way of a submit button) sends 'jason' rather than 'Jason'.

Seriously... is it supposed to be like this? Why would it be like this? And at the very least... how can I transformText for reals*?

Jason
* for reals = so my js and PhP see the 'Jason' not 'jason'

It is acting correctly. When you change the textTransform property, all are doing is manipulating the CSS text-transform property, which causes the text to display a certain way, though the text is in reality however it was originally.

If you want the text to ACTUALLY transform, you'll need to do it manually, with some text manipulating code:

text = document.getElementById(tgt.id).innerHTML;
text = text.charAt(0).toUpperCase() + text.substr(1);

Something like that should work handily.

But easier, since you're using PHP on the server side, would to be just manipulate the received data before sending it, with PHP's ucfirst() or ucwords() function.

Originally Posted by wayfarer07

But easier, since you're using PHP on the server side, would to be just manipulate the received data before sending it, with PHP's ucfirst() or ucwords() function.

Thanks. In the end, I did do ucwords, plus lots of angry emails to docjs - textFakeyTransform not textTransform.

see the part in red?
document.getElementById(tgt.id).style.textTransform="capitalize";

Any time you are manipulating a node's style object, the result is a manipulation of that element's inline CSS rules. CSS properties which would have been expressed with a dash (font-weight, font-size, list-style, margin-top, etc.) are expressed in camelCase. This could be a good lesson for you, since manipulating styles is a key element of client-side JavaScript.