Javascript fails to hide some DIVs
I got the "New user form". There are three different clearence levels:
- client
- clientContact
- clientRepresentative
And there are some fields, like newMail, newPostalCode, etc.
Here is a code I am using to show an element:
function doShow(obj) {
document.getElementById(obj).style.display = '';
}
And a code I am using to hide an element:
function doHide(obj) {
document.getElementById(obj).style.display = 'none';
}
It works for small bloc开发者_开发问答ks of data. While creating an user, the clearence level is specified, if it is clientRepresentative the appropriate field is being shown. In example, client has only one e-mail adress, clientRepresentative has two e-mail addresses and clientContact has three.
But this don't work!. If I choose client, there is one e-mail, just as planned, but if I choose clientContact and then switch to clientRepresentative the redundant field (e-mail3) is not being hidden.
I believe this is a JavaScript issue, please help me, since my anger level hits the ceiling.
edit: I forgot to paste function used to show/hide the items.
if (clearenceLevel != "Chose...") {
if (clearenceLevel == "client") {
doShow("newMail");
doHide("newMail2");
doHide("newMail3");
doShow("newNip");
doShow("newRegon");
doShow("newStreet");
doHide("newHeadquarters");
doShow("newAddress");
doShow("newPostalCode");
doShow("kptekst");
doShow("newCity");
doShow("newAccount");
doShow("newState");
doHide("newStatus");
doHide("newPassword");
} else if (clearenceLevel == "clientRepresentative") {
doShow("newMail");
doShow("newMail2");
doHide("newStatus");
doHide("newMail3");
doHide("newNip");
doHide("newRegon");
doHide("newStreet");
doHide("newHeadquarters");
doHide("newAddress");
doHide("newPostalCode");
doHide("newCity");
doHide("newAccount");
doHide("newState");
doHide("kptekst");
doShow("newPassword");
} else if (clearenceLevel == "clientContact") {
doShow("newMail");
doShow("newMail2");
doShow("newMail3");
doHide("newNip");
doHide("newRegon");
doHide("newStatus");
doHide("newStreet");
doHide("newHeadquarters");
doHide("newAddress");
doHide("newPostalCode");
doHide("newCity");
doHide("newAccount");
doHide("newState");
doHide("kptekst");
doHide("newPassword");
}
}
Not a direct answer to your question, but a suggestion on how you could improve the way that you're doing this. Instead of having to list each property to display and hide for each user level, do something like:
<input type="text" name="email" class="client representative contact">
<input type="text" name="ssn" class="representative">
Then when the user level changes hide everything and then unhide everything that has the correct level. So in my example "email" is available to "client" "representative" and "contact". So if they switched to any of those levels, this field would display, however "ssn" is only available to "representative" so it wouldn't display for anyone else.
The advantage of this would be the ability to easily add a brand new item without needing to modify the Javascript, only the HTML.
if (clearenceLevel != "Chose...") {
hideAll();
if (clearenceLevel == "client") {
doShow("client");
} else if (clearenceLevel == "clientRepresentative") {
doShow("representative");
} else if (clearenceLevel == "clientContact") {
doShow("contact");
}
}
You have probably made a mistake in the code.
else if (clearenceLevel == "clientRepresentative") {
doShow("newMail");
doShow("newMail2");
doHide("newStatus");
doShow("newMail3"); // shouldn't this be doHide()?
// etc
From your message I understood that you want to hide the e-mail3 while switching to clientRepresentative, but in the code above doShow() is executed instead of doHide().
Thanks for your answers, I am posting the form used to send the data
echo '<div id="newMail"><br><font color="red">*</font>email: <input type="text" name="newMail" value="' . $_POST['newMail'] . '" /> </div>';
echo '<div id="newMail2"><br>email 2: <input type="text" name="newMail2" value="' . $_POST['newMail2'] . '" /> </div>';
echo '<div id="newMail3"><br>email 3: <input type="text" name="newMail3" value="' . $_POST['newMail3'] . '" /> </div>';
echo '<div id="newNip"><br>nip: <input type="text" maxlength="15" name="newNip" value="' . $_GET['nip'] . '"/> </div>';
echo '<div id="newRegon"><br>regon: <input type="text" name="newRegon" value="' . $_POST['newRegon'] . '" /> </div>';
echo '<div id="newStreet"><br>Street: <input type="text" name="newStreet" value="' . $_POST['newStreet'] . '" /> </div>';
echo '<div id="newHeadquarters"><br>Headquarters: <select name="newHeadquarters"> ';
精彩评论