Question

I am making some changes on an already established website and need to make the following change.

Currently, there are three images and when one of the image is clicked/chosen, a text message displays and after that a next button can be clicked which takes them to the next page.

Currently, the next button (an image) shows right when the page loads, which means that users can click next without selecting an option.

The page is already coded with php and javascript and I was thinking of doing a quick and dirty trick. This is what I am planing:

Create a CSS DIV within the html with display=none; and change the property of the DIV to display whenever the text message is displayed.

My question is: is there a way to access and change a property of a DIV using php?

CSS in HTML page:

#btnNext{
position:absolute;
display:none;
top:300px;
left:200px;
width:75px;
height:25px;


<?php 
if(isset($_GET['supportID']) && $_GET['supportID'] != "")
{
    if ($_GET['supportID'] == 1)
    {echo "Protecting Geckos and Their Habitats, click next";}
    elseif ($_GET['supportID'] ==2) 
    {echo "Planting, click next";}
?>

Thanks in advance.

Answer 1

Typically you would ‘disable’ the button until they click an image. This can be done using the following html:

<input id="btn_next" type="sumit" disabled="disabled"/>

You would then enable this button when the user selects an image, using JavaScript, something like this:

document.getElementById("btn_next").removeAttribute("disabled");

This implementation would conform to web standards.

If you wanted to stick with your button not appearing at all until the user selects the appropriate option, your code would look something like:

<input id="btn_next" type="submit" style="display:none;"/>

With javascript:

document.getElementById("btn_next").style.display = "block";