show/hide div layer on form submit?

[moscarda]

I've made a simple mailing list form nested in a div layer floating in the corner of the screen. its basically just a text field and submit button. is it possible to hide the div layer that the form is in, when the user clicks submit?

I'm imagining this would be a javascript question, but if not, can someone point me in the right direction?

[Jas]

That would depend entirely on the type of action the form envokes. Is it an action form, or a submitted form? For an action form (i.e. the user types hello in a box and clicks the action button and an alert then says "hello"), you can use

//in the head section
function hideit(){
document.getElementById('DIVtoHIDE').style.display = 'none';
}
//in the button
onsubmit="hideit()"
//or
onclick="hideit()"

But if the form is submitted (i.e. the page changes) you will need to use a cookie or something similar to find out if the form was submitted and thus hide it. Try looking at this. (You can also do this, perhaps in a better way-- without cookies-- with a server-side language like PHP.)

[moscarda]

Thanks for your reply, but I'm afraid I did not understand your instructions. To answer your question, here is what my form looks like, and I'd like to make it so that when it posts it doesn't redirect the user, but instead simply hides the div layer the form is in.

<!-- newsletter subscribe below here -->

<script language="Javascript" type="text/javascript">
var fieldstocheck = new Array();
fieldnames = new Array();
function checkform() {
for (i=0;i<fieldstocheck.length;i++) {
if (eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value") == "") {
alert("Please enter your "+fieldnames[i]);
eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");
return false;
}
}
return true;
}
function addFieldToCheck(value,name) {
fieldstocheck[fieldstocheck.length] = value;
fieldnames[fieldnames.length] = name;
}
</script>

<form method="post" action="http://www.yourdomain.com/lists/?p=subscribe&id=1" name="subscribeform">
Email:<input type="text" name="email" value = ""><br>
<script language="Javascript" type="text/javascript">addFieldToCheck("email","Email Address");</script>
Name: <input type="text" name="attribute2" value = "">
<script language="Javascript" type="text/javascript">addFieldToCheck("attribute2","Name");</script>
<input type="hidden" name="list[1]" value="signup" />
<input type="submit" name="subscribe" value="Subscribe" onClick="return checkform();">
</form>

<!-- newsletter subscribe ends here -->

[Jas]

Well, the type of form you have connot do that unless you use something like AJAX, I think, that can communicate with the server in realtime. I'm sorry, but I don't know that programming language. You might try learning about the language here, though.

[rangana]

Hi moscarda,
If i'm taking this right, you want the div be hidden when the submit is pressed?
If so, add this script in the head:

<script type="text/javascript">
function hide(){
document.getElementById('idOfTheDivYouWantToHide').style.display='none';
}
</script>

Then on your page, you could enable the code during onSubmit or onClick of the submit button, see if it helps

[moscarda]

youre right, that didn't work. i'll look into the AJAX thing. thanks

[rangana]

It did'nt work??...

Okay, if you're going to ajax then...GOOD LUCK!!..

[moscarda]

you seem surprised, if you know a way of getting it to work, and/or can provide some test code, please do so! i dont know anything about ajax, nor do i imagine i will be able to learn it in time for my deadline.