PHP中的多步骤表单

时间:2018-11-08 08:56:15

标签: php

我要用php创建的此多步骤表单存在问题。在每种表单中,您都可以存储当前步骤-这样脚本可以知道哪个阶段 用户已到达-以及用户已在其他步骤中输入的数据。当用户提交当前步骤时,脚本将运行该功能以将用户带入另一个阶段。具有“名称” firstName,lastNmae和注释的输入可以很好地工作,但是当用户返回上一步时,选择框和单选按钮不保留值...我该怎么办...

<!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 &gt;">
            </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="&lt; back">
                <input type="submit" name="submitButton" id ="next" value="next &gt;">
            </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="&lt; back">
                <input type="submit" name="submitButton" id ="next" value="next &gt;">
            </div>
        </form>


        <?php }?>

        <?php


        function processStep3(){

            if (isset($_POST["submitButton"]) AND $_POST["submitButton"] == "< back" ) {
                displayStep2();
            }else{
                displayThanks();
            }
        }

        function displayThanks(){
            echo "successful";
        }

        ?>









</body>
</html>

1 个答案:

答案 0 :(得分:0)

不是:

echo 'select = "selected"';

应该是:

echo 'selected = "selected"';

还可以使用HTML5自动填充功能,在每种表单上都可以使用autocomplete =“ on”:

<form action="registration_multistep.php" method="post" autocomplete="on">


<form action="registration_multistep.php" method="post"  autocomplete="on">

<form action="registration_multistep.php" method="post" autocomplete="on">

它将对选择框有帮助。但是我想它不会在单选按钮上起作用。如果您不想在步骤之间使用php会话或javascript,可以将其更改为“选择框”。