/    Sign up×
Community /Pin to ProfileBookmark

How to avoid this?

Copy linkTweet thisAlerts:
Jul 20.2007

I’ve made a text field which automatically converts each letter I’m typing in to uppercase.

The problem is when I edit the typed word, the cursor is relocated constantly at the end of the word just after writing the new letter.

How can I avoid this?

This is the simple code that does it:

[code=html]<input name=”textField” type=”text” onkeyup=”this.value=this.value.toUpperCase()”>[/code]

to post a comment
JavaScript

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@Tweak4Jul 20.2007 — Consider replacing your onkeyup with an onBlur. The mechanics would be slightly different, but the end result would be the same, only without the editing problems you described.
Copy linkTweet thisAlerts:
@thechasboiJul 20.2007 — I do the same sort of thing with a text field as well but I check for only numbers or integers to be exact. There is no way to stop this from happening unless you use the onblur as suggested by Tweak4. I personally use the onblur and the onkeyup becuase i find sometimes that the keyup is a tab and may not catch something. At any rate you can not manipulate where the cursor is. You can scroll things but you can not actually put the cursor on something. This is a security risk, spammers and malwarers can force you to click some where to instal something on your puter if you were to visit a site by them. OK enough blabbing. Hope that helps.
Copy linkTweet thisAlerts:
@JazztronikauthorJul 20.2007 — Thanks guys for your help.

However how can I do the same with this other event handler onBlur? as far as I know, the event 'blur' is only triggered just when the focus gets out from the text field.
Copy linkTweet thisAlerts:
@thechasboiJul 20.2007 — This is correct the event is called in code onblur="this.value=this.value.toUpperCase();"
Copy linkTweet thisAlerts:
@JazztronikauthorJul 20.2007 — Hi again chasboi, with onBlur, the letters don't change to uppercase immediately one by one as I'm typing them in. That's what I meant to do.
Copy linkTweet thisAlerts:
@Tweak4Jul 20.2007 — That is correct- they will change when the field in question loses focus. Unfortunately, it looks like you're stuck with the lesser of two evils here. You can either validate each key stroke, and have the problems you described, or you can validate on blur, and not have the effect immediately. Having both benefits and neither side effect would require a fair bit of fancy scripting that I'm honestly not sure how to do off the top of my head.
Copy linkTweet thisAlerts:
@thechasboiJul 20.2007 — I might agree with Tweak4 but I am inclined to say that you can not put the cursor in a spot of you desiring since it is again a security risk on the users aspect. It looks like you are stuck with this problem. Oh I have an idea you could write a function that only allows the ascii numbers of the uppercase letters to appear on the screen. let me see.
[CODE]
onKeyUp="this.value=this.value.replace(/[^[A-Z]]*/,'');"
[/CODE]

Try that see what happens
Copy linkTweet thisAlerts:
@JazztronikauthorJul 20.2007 — Thanks again for your replies both of you. ?

Chasboi, that other code creates a curious effect hehe, but not the one I intended to do. But it's ok mates, it doesn't matter. I'll assume I cannot do it because of security reasons and will take one of the previous choices.

Best regards!
×

Success!

Help @Jazztronik spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...