D
David Smithz
Hello there,
I have created a php webpage that is a three stage process for applying for
something.
The page consists of three <div> sections, each one containing a form.
Each form action is the web page itself again, only with a value sent to
identify the form that was submitted.
My intention was to only ever have one form displayed at a time and I
controlled this by for each <div> section, depending on whether the
particular div section is the current stage the user is at, the php code
selects which class to apply to the div to determine whether the form is
hidden or not.
I hope this makes sense so far as this part all worked as expected. Below is
an example of the CSS used:
..AccountsTableHidden {
visibility: hidden;
left:1em;
top:50em;
position:absolute;
z-index:1;
}
..AccountsTableVisible {
visibility: visible;
left: 1em;
top:1em;
position:absolute;
z-index:10;
}
and below an example of the <div> tag:
<div class="AccountsTable<?php if ( ($currentStage=="stage2")) { echo
"Visible";} else { echo "Hidden";} ?>">
If the a form is one to be displayed, then its containing class is set to
the visible class and the other two forms would therefore get set to the
hidden class.
This all worked well until I tried to changed the positioning to "absolute".
This is because I wanted each div to be displayed in the same place (so they
are overlap each other when displayed, but only one div containing a form is
displayed at a time).
The problem is, when using absolute positing, I get funny effects. For
example, when I get to stage two of the form, and try to select a radio
button on the form I cannot select it. If I move the mouse slightly to the
right, the radio button appears again (displayed twice) and the new one I
can click on. If I refresh the page, the page reloads slightly to the left.
I get similar effects in IE or Firefox, while not exactly the same, it is
strange never the less. In fact in Firefox, I clicked on the submit, then
the whole page kind of redrew itself to the left slightly, then the same
thing happened again, then it finally let me press the submit button.
Does anyone have any insight to what is going on here?
If so, then please let me know.
Thanks in advance.
I have created a php webpage that is a three stage process for applying for
something.
The page consists of three <div> sections, each one containing a form.
Each form action is the web page itself again, only with a value sent to
identify the form that was submitted.
My intention was to only ever have one form displayed at a time and I
controlled this by for each <div> section, depending on whether the
particular div section is the current stage the user is at, the php code
selects which class to apply to the div to determine whether the form is
hidden or not.
I hope this makes sense so far as this part all worked as expected. Below is
an example of the CSS used:
..AccountsTableHidden {
visibility: hidden;
left:1em;
top:50em;
position:absolute;
z-index:1;
}
..AccountsTableVisible {
visibility: visible;
left: 1em;
top:1em;
position:absolute;
z-index:10;
}
and below an example of the <div> tag:
<div class="AccountsTable<?php if ( ($currentStage=="stage2")) { echo
"Visible";} else { echo "Hidden";} ?>">
If the a form is one to be displayed, then its containing class is set to
the visible class and the other two forms would therefore get set to the
hidden class.
This all worked well until I tried to changed the positioning to "absolute".
This is because I wanted each div to be displayed in the same place (so they
are overlap each other when displayed, but only one div containing a form is
displayed at a time).
The problem is, when using absolute positing, I get funny effects. For
example, when I get to stage two of the form, and try to select a radio
button on the form I cannot select it. If I move the mouse slightly to the
right, the radio button appears again (displayed twice) and the new one I
can click on. If I refresh the page, the page reloads slightly to the left.
I get similar effects in IE or Firefox, while not exactly the same, it is
strange never the less. In fact in Firefox, I clicked on the submit, then
the whole page kind of redrew itself to the left slightly, then the same
thing happened again, then it finally let me press the submit button.
Does anyone have any insight to what is going on here?
If so, then please let me know.
Thanks in advance.