Welcome to WebmasterWorld Guest from

Forum Moderators: coopster & jatar k

Message Too Old, No Replies

display:visible if first time page loads

Radiobutton select first time the page loads

9:38 pm on Oct 9, 2010 (gmt 0)

5+ Year Member

I'll try to explain my problem:

I have 4 DIV's which can be toggled visible or hidden. If I show one div, the other close. If I show another div, the first close and so on.
Only one DIV can have display:visible at the time.

I have the DIV's ID numbers from a for-loop, and I have a SESSION-check to see if a DIV have a radiobutton which is checked.

If the radiobutton for any of my 4 div's are checked, then set display:visible on that DIV <-- this works!

But the first time the page loads, I want the first DIV to be display:visible. And the other div's to be closed.

If the page loads again, and a DIV is checked, then do NOT show the first div as visible.

Maybe it's easier with some code:

This set's a SESSION as soon as one of the radiobutton are checked.
The variable is used within the code for the "make radiobutton"

$checked1 = ($selection[$i]['id'] == $_SESSION['payment'] ? true : false);

This checks to see if one of the radiobuttons are checked:
if ($checked1 == 1) {
$divStyle = "display: visible";
} else {
$divStyle = "display: none";

This is the DIV's code (all of them are in a for-loop of course
<DIV style="<?php echo $divStyle; ?>; background:#f0f1f4; float:left; width:1053px; padding:20px; margin-bottom:10px; border: dashed 1px #3b5bae;" CLASS="toggle" id="<?php echo $i; ?>">

I understand why none are checked at the first pageload, but how can I make the first DIV have display:visible, first time page loads?

Hope this was understandable, I'm not good at saying much with little ;)
10:10 pm on Oct 9, 2010 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

You will need to add an extra loop to check if any of the payment options is selected and setup a flag based on that.

$setup_flag = false;
for($i=0, $j=count($selection); $i<$j; $i++) {
if( $selection[$i]['id'] == $_SESSION['payment'] ) {
$setup_flag = true;

$checked1 = ($selection[$i]['id'] == $_SESSION['payment'] ? true : false);

if( $checked1 || !$setup_flag ) {
$divStyle = "display: visible";
$setup_flag = true;
} else {
$divStyle = "display: none";
10:43 pm on Oct 9, 2010 (gmt 0)

5+ Year Member

Thank you very much for answering!
Actually I used the same loop that prints out the div's, which gives each div an ID.

I used that one - and then I made a check to see if the session was set, something like this:

if ($_SESSION['payment'] == "") {
$firsttime = 1;
} else {
// do nada

and then:

if ($i == 0) {
if ($firsttime == "1") {
$divStyle = "display: visible";

works pretty well! :D

I just started out with PHP about a month ago, and I have no former programming experice, so I'm very proud of my self right now ;)

Thanks again!
10:49 pm on Oct 9, 2010 (gmt 0)

5+ Year Member

One more question though:

The code that I mentioned was for an online store -> choose payment-method.

When the radiobutton is hit, the page reloads with an onclick="updateForm();

Since this is my checkout-page, I don't want to confuse the customer more than needed, so I would like the page to reload back to the place they were when they selected the payment-method - and not start from the top again. Maybe possible with making an anchor or something?

Any clue on how to to this?
11:00 pm on Oct 9, 2010 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

You could use ajax for that so when the button is clicked the js sends a request to the server, the later responds and the js then updates the parts of the page you want.

Also you should always have an alternative method for submitting forms without js. Instead of the onclick mangled with the HTML use a framework like jquery is far easier to handle events.
11:05 am on Oct 10, 2010 (gmt 0)

5+ Year Member

Ok, thanks again.
I'll find something to read ;)

Featured Threads

Hot Threads This Week

Hot Threads This Month