/    Sign up×
Community /Pin to ProfileBookmark

dynamically changing onblur/onfocus events

Copy linkTweet thisAlerts:
Jun 11.2012

Hi, I’m working on a multi-lingual site where ajax is used to load and replace tags based on the elements id.

ie.

[CODE] <span id=”text_firstname”>First Name</span>[/CODE]

and the language tag is updated like this:

[CODE]document.getElementById(‘text_firstname’).innerHTML = data.langrow[‘text_firstname’];[/CODE]

we have a field with onblur/onfocus events to prompt the user to enter some input:

[CODE]<input id=”id_entername” value=”Enter Your Name” name=”name”
onblur=”if (this.value == ”) {this.value = ‘Enter Your Name’;}”
onfocus=”if (this.value == ‘Enter Your Name’) {this.value = ”;}” type=”text”>[/CODE]

what is the best way to replace the onblur/onfocus values to a different language?

to post a comment
JavaScript

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@xelawhoJun 12.2012 — here is a hardcoded example using a select to change languages - it should be easy enough to incorporate an ajax call...

[CODE]
<body>
<input id="id_entername" name="name" type="text" style="width:200px">
<input id="id_enterage" name="age" type="text" style="width:200px">
<select onchange="changeLang(this.value)">
<option>- Please select a language - </option>
<option value="english">English</option>
<option value="spanish">Spanish</option>
<option value="french">French</option>
</select>

<script type="text/javascript">
function changeLang(lang){
langs={english:{name:"please enter your name",age:"please enter your age"},
french:{name:"s'il vous plaît entrer votre nom",age:"s'il vous plaît entrer votre âge"},
spanish:{name:"por favor, introduzca su nombre",age:"por favor, introduzca su edad"}}
entname=document.getElementById("id_entername");
entname.value=langs[lang].name;
entname.onblur=function(){if (this.value == '') {this.value = langs[lang].name;}}
entname.onfocus=function(){if (this.value == langs[lang].name) {this.value = ""}}
entage=document.getElementById("id_enterage")
entage.value=langs[lang].age;
entage.onblur=function(){if (this.value == '') {this.value = langs[lang].age;}}
entage.onfocus=function(){if (this.value == langs[lang].age) {this.value = ""}}
}
changeLang("english");
</script>
</body>


[/CODE]
Copy linkTweet thisAlerts:
@riker99authorJun 12.2012 — Perfect! thanks!
×

Success!

Help @riker99 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.20,
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,
)...