i am having problem with this multi step form i want to create with php. Within each form, you can store the current step — so that the script knows what stage the user has reached — as well as the data already entered by the user in other steps. when the user submits the current step the script runs the function to take the user to another stage. the inputs with "name" firstName, lastNmae and comments works perfectly fine but the select box and the radio button those not retain the value when the user goes back to the previous step... what do i do...
<!DOCTYPE html>
<html>
<head>
<title>membership form</title>
</head>
<body>
<?php
if (isset($_POST["step"]) AND $_POST["step"] >= 1 AND $_POST["step"] <= 3 ) { // note that this will only return true when the form containing the input with name "step" has been submitted..dont get confused that the input has its attr of "value" already set eg "value = 1"; that is why if you load the page the "displayStep1();" runs.
call_user_func("processStep" .(int)$_POST["step"]);
}else{
displayStep1();
}
function setInputValue($fieldName){
if (isset($_POST[$fieldName])) {
echo $_POST[$fieldName];
}
}
function setChecked($fieldName , $fieldValue){
if (isset($_POST[$fieldName]) AND $_POST[$fieldName] == $fieldValue) {
echo 'checked = "checked" ';
}
}
function setSelected($fieldName , $fieldValue){
if (isset($_POST[$fieldName]) AND $_POST[$fieldName] == $fieldValue) {
echo 'select = "selected"';
}
}
function displayStep1(){?>
<form action="registration_multistep.php" method="post">
<h1>Member Signup: Step 1</h1>
<div style="width: 30em;">
<!--to keep track of the steps-->
<input type="hidden" name="step" value="1"> <!-- note that even if u set the value of a form element in the attr "value", php script will not return true unless the form has been submitted-->
<!--notice the input for gender is only 1 here and the value is what the setInputValue() function echoed and the only argument passed is 'gender' for $fieldValue-->
<label></label><input type="hidden" name="gender" value=" <?php setInputValue('gender'); ?>" ><br><br>
<label for = "favourite"></label><input type="hidden" name="favourite" id="favourite" value = "<?php setInputValue('favourite');?>" > <br><br>
<label for = "comments"></label><input type="hidden" name="comments" id="comments" value="<?php setInputValue('comments'); ?>"><br><br>
<label for = "password"></label><input type="hidden" name="password" id="password"><br><br>
<label for = "passwordRetype"></label><input type="hidden" name="passwordRetype" id="passwordRetype"><br><br>
<label for = "firstName">first name</label><input type="text" name="firstName" id="firstName" value="<?php setInputValue('firstName'); ?>"><br><br>
<label for = "lastName">last name</label><input type="text" name="lastName" id="lastName" value="<?php setInputValue('lastName'); ?>"><br><br>
<input type="submit" name="submitButton" value="next >">
</div>
</form>
<?php } ?>
<?php
function processStep1(){
displayStep2();
}
function displayStep2(){?>
<form action="registration_multistep.php" method="post">
<h1>Member Signup: Step 1</h1>
<div style="width: 30em;">
<input type="hidden" name="step" value="2"> <!-- note that even if u set the value of a form element in the attr "value", php script will not return true unless the form has been submitted-->
your gender<br>
<label for = "male">male</label><input type="radio" name="gender" id="male" value="male" <?php setChecked('gender' , 'male'); ?> > <br><br>
<label for = "female">female</label><input type="radio" name="gender" id="female" value="female" <?php setChecked('gender' , 'female'); ?> > <br><br>
<select name="favourite">
<option value="default" <?php setSelected('favourite' , 'default');?> >selected</option>
<option value="rice" <?php setSelected('favourite' , 'rice'); ?> >rice</option>
<option value="beans" <?php setSelected('favourite' , 'beans'); ?> >beans</option>
</select>
<label for = "comments"></label><input type="hidden" name="comments" id="comments" value="<?php setInputValue('comments'); ?>"><br><br>
<label for = "firstName"></label><input type="hidden" name="firstName" id="firstName" value="<?php setInputValue('firstName'); ?>"><br><br>
<label for = "lastName"></label><input type="hidden" name="lastName" id="lastName" value="<?php setInputValue('lastName'); ?>"><br><br>
<input type="submit" name="submitButton" id ="back" value="< back">
<input type="submit" name="submitButton" id ="next" value="next >">
</div>
</form>
<?php }?>
<?php
function processStep2(){
if (isset($_POST["submitButton"]) AND $_POST["submitButton"] == "< back") {
displayStep1();
}else{
displayStep3();
}
}
function displayStep3(){?>
<form action="registration_multistep.php" method="post">
<h1>Member Signup: Step 1</h1>
<div style="width: 30em;">
<input type="hidden" name="step" value="3"> <!-- note that even if u set the value of a form element in the attr "value", php script will not return true unless the form has been submitted-->
<!--notice the input for gender is only 1 here and the value is what the setInputValue() function echoed and the only argument passed is 'gender' for $fieldValue-->
<label></label><input type="hidden" name="gender" value=" <?php setInputValue('gender'); ?>" ><br><br>
<label for = "favourite"></label><input type="hidden" name="favourite" id="favourite" value="<?php setInputValue('favourite'); ?>"><br><br>
your comment<br>
<label for = "comments"></label><input type="text" name="comments" id="comments" value="<?php setInputValue('comments'); ?>"><br><br>
<label for = "firstName"></label><input type="hidden" name="firstName" id="firstName" value="<?php setInputValue('firstName'); ?>"><br><br>
<label for = "lastName"></label><input type="hidden" name="lastName" id="lastName" value="<?php setInputValue('lastName'); ?>"><br><br>
<input type="submit" name="submitButton" id ="back" value="< back">
<input type="submit" name="submitButton" id ="next" value="next >">
</div>
</form>
<?php }?>
<?php
function processStep3(){
if (isset($_POST["submitButton"]) AND $_POST["submitButton"] == "< back" ) {
displayStep2();
}else{
displayThanks();
}
}
function displayThanks(){
echo "successful";
}
?>
</body>
</html>
