check all textfields

F

frizzle

Hi there,

I'm building a multi-language PHP/mySQL -site.
I'm also building a CMS for the site.

There are 5 languages. In the CMS fields for e.g. english
bodytext are called (id=) 'bodytext_en'.
German looks like 'bodytext_ge', etc.

The '_en' part tells us that it's a textfield for english texts.
How can i check if ALL english fields are filled out, without
defining each and every field separately.
Like:

if(document.(allfields.'_en').value == ''){
alert('Hey!')
};

Thanks!
 
D

Dietmar Meier

frizzle said:
How can i check if ALL english fields are filled out, without
defining each and every field separately.
Click to expand...

Fully untested quickhack:

function checkComplete(sLangIdentifier) {
var i, j, nForms, nElems, oCurForm, oCurElem, aTitles, rLang;
rLang = new RegExp("_" + rLang + "$", "i");
nForms = document.forms.length;
for (i=0; i<nForms; i++) {
oCurForm = document.forms;
nElems = oCurForm.elements.length;
for (j=0; j<nElems; j++) {
oCurElem = oCurForm.elements[j];
if ((oCurElem.type == "text" || oCurElem.type == "textarea")
&& oCurElem.name.match(rLang)
&& oCurElem.value == ""
) {
aTitles[aTitles.length]= oCurElem.title;
}
}
}
if (aTitles.length) {
alert(
"Information for " +
sLangIdentifier +
" is not complete!\n\n" +
"Please fill out the following inputs:\n" +
aTitles.join("\n")
);
}
}

ciao, dhgm
 
R

RobG

Dietmar said:
frizzle said:
How can i check if ALL english fields are filled out, without
defining each and every field separately.
Click to expand...


Fully untested quickhack:

function checkComplete(sLangIdentifier) {
var i, j, nForms, nElems, oCurForm, oCurElem, aTitles, rLang;
rLang = new RegExp("_" + rLang + "$", "i");
nForms = document.forms.length;
for (i=0; i<nForms; i++) {
oCurForm = document.forms;
nElems = oCurForm.elements.length;
for (j=0; j<nElems; j++) {
oCurElem = oCurForm.elements[j];
if ((oCurElem.type == "text" || oCurElem.type == "textarea")
&& oCurElem.name.match(rLang)
&& oCurElem.value == ""
) {
aTitles[aTitles.length]= oCurElem.title;
}
}
}
if (aTitles.length) {
alert(
"Information for " +
sLangIdentifier +
" is not complete!\n\n" +
"Please fill out the following inputs:\n" +
aTitles.join("\n")
);
}
}

ciao, dhgm
Click to expand...


Elegant, but it seems to me that a better way is to have one form and
change the text labels depending on the language chosen. Only one
set of form elements is required with one set of validation rules.

Multiple error messages are required, maybe multiple messages for
each language but I've allowed for one per selected language.

Multiple classes are used on elements to show how to use styles in
this context. Note that the 'en' class doesn't need to be defined.

The reset and onload functions should account for page re-loads and
form reset as well - it's easy to get the selection and labels out of
sync.

Onclick is used for the radios rather than onchange because of IE's
implementation where onchange doesn't do anything until the control
loses focus (as per the spec, but different to Geko browsers and
confusing to many).


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>test</title>
<style type="text/css">
..ge {display: none;}
..fr {display: none;}
</style>
<script type="text/javascript">

function getLang(f){
var b = f.elements['lang'];
var i = b.length;
while (i-- && !b.checked );
return b.value;
}

function changeLang(f,lang){
var div = document.getElementById(f.name + 'labels');
var s = div.getElementsByTagName('span');
var i = s.length;
lang = new RegExp('\\b'+lang+'\\b');
while (i--){
s.style.display =
(lang.test(s.className))? 'inline' : 'none';
}
}

function resetLang(f) {
var x = f.elements['lang'];
var i = x.length;
while ( i-- && !x.checked );
x.click();
}

function checkForm(f){
var errObj = {
en : 'English error message...',
ge : 'German error message...',
fr : 'French error message...'
}
var els = f.elements;
var i = els.length;
while (i--){
el = els;
if ( 'text' == el.type || 'textarea' == el.type ){
// do validation
if ( '' == el.value ) {
alert(errObj[getLang(f)]);
return false;
}
}
}
return true;
}

window.onload = function () {
document.forms['formA'].reset()};
</script>
</head>
<body>
<form action="" name="formA" onsubmit="return checkForm(this);">
<div id="formAlabels">
Select a language:<br>
English<input type="radio" name="lang" value="en" checked
onclick="changeLang(this.form,this.value)">
&nbsp;&nbsp;German<input type="radio" name="lang" value="ge"
onclick="changeLang(this.form,this.value)">
&nbsp;&nbsp;French<input type="radio" name="lang" value="fr"
onclick="changeLang(this.form,this.value)">
<br>
<input type="text" name="userName" size="30">
<span class="en">Name (english)</span>
<span class="ge">Name (german)</span>
<span class="fr">Name (french)</span>
<br>
<textarea name="userAddr" rows="5" cols="30"></textarea>
<span class="en">Address (english)</span>
<span class="ge">Address (german)</span>
<span class="fr">Address (french)</span>
<br>
<input type="reset" onclick="
this.form.reset();
resetLang(this.form);
">
<input type="submit" value="Send details...">
</div>
</form>
</body>
</html>
 
R

RobG

RobG wrote:

Agggh, forgot to update the posted script, here is the one with
multiple classes:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<title>test</title>
<style type="text/css">
..ge {display: none;}
..fr {display: none;}
..label {font-family: sans-serif; color: #666699;}
..tip {font-family: sans-serif; color: #9999dd; font-size: 80%;}
</style>
<script type="text/javascript">

function getLang(f){
var b = f.elements['lang'];
var i = b.length;
while (i-- && !b.checked );
return b.value;
}

function changeLang(f,lang){
var div = document.getElementById(f.name + 'labels');
var s = div.getElementsByTagName('span');
var i = s.length;
lang = new RegExp('\\b'+lang+'\\b');
while (i--){
s.style.display =
(lang.test(s.className))? 'inline' : 'none';
}
}

function resetLang(f) {
var x = f.elements['lang'];
var i = x.length;
while ( i-- && !x.checked );
x.click();
}

function checkForm(f){
var errObj = {
en : 'English error message...',
ge : 'German error message...',
fr : 'French error message...'
}
var els = f.elements;
var i = els.length;
while (i--){
el = els;
if ( 'text' == el.type || 'textarea' == el.type ){
// do validation
if ( '' == el.value ) {
alert(errObj[getLang(f)]);
return false;
}
}
}
return true;
}

window.onload = function () {
document.forms['formA'].reset()};
</script>
</head>
<body>
<form action="" name="formA" onsubmit="return checkForm(this);">
<div id="formAlabels">
Select a language:<br>
English<input type="radio" name="lang" value="en" checked
onclick="changeLang(this.form,this.value)">
&nbsp;&nbsp;German<input type="radio" name="lang" value="ge"
onclick="changeLang(this.form,this.value)">
&nbsp;&nbsp;French<input type="radio" name="lang" value="fr"
onclick="changeLang(this.form,this.value)">
<br>
<input type="text" name="userName" size="30">
<span class="label en">Name (english)</span>
<span class="label ge">Name (german)</span>
<span class="label fr">Name (french)</span>
<br>
<textarea name="userAddr" rows="5" cols="30"></textarea>
<span class="label en">Address (english)</span>
<span class="tip en">Address tip (english)</span>
<span class="label ge">Address (german)</span>
<span class="tip ge">Address tip (german)</span>
<span class="label fr">Address (french)</span>
<span class="tip fr">Address tip (french)</span>
<br>
<input type="reset" onclick="
this.form.reset();
resetLang(this.form);
">
<input type="submit" value="Send details...">
</div>
</form>
</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

checking textfields 1
How to check the date validity? 1
how to keep state of checkboxes and textfields 0
Company web-site (all perl CGI) re-design, suggestions? 2
Creating a form dynamically with a Repeater 1
Problems understanding the MVC - please help 0
labels + value 1
Gathering data from form fields within iFrames 2

Members online

No members online now.
Total: 33 (members: 0, guests: 33)
Robots: 444

Forum statistics

Threads
473,769
Messages
2,569,580
Members
45,054
Latest member
TrimKetoBoost

Latest Threads

Top