Question

我试图提交表单，按下提交按钮后，我希望第二个表单显示，同时仍然保持值（我已经完成了这部分）。我被告知要使用isset功能，但我无法使其正常工作。代码工作正常（我还没有复制php的东西）。

<!DOCTYPE html>
<html>
<head>
    <title>Prac 2 Task 12</title>
</head>

<body>

<form method="post" action="<?php echo $_SERVER["PHP_SELF"];?>" id="custinfo" >
    <table>
    <tr>
        <td><label for="customerid">Customer ID (integer value): </label></td>
        <td>
            <input 
                type="text" 
                id="customerid" 
                name="customerid" 
                size="10" 
                value="<?php 
                    echo isset($_POST['customerid']) 
                        ? htmlspecialchars($_POST['customerid'])
                        : ''; ?>" 
                />
            <?php echo $customerIDError ?>
        </td>
        <td style="color:red"></td>
    </tr>
    </table>
    <p>
        <input type="submit" name = "submit" value="Save Data"/> 
        <input type="reset" value="Reset Form" />
    </p>
</form>

<form method="post" action="<?php echo $_SERVER["PHP_SELF"];?>" id="custinfo" >
    <table>
    <tr>
        <td><label for="username">Username: </label></td>
        <td>
            <input 
                type="text" 
                id="username" 
                name="username" 
                size="10" 
                value="<?php 
                    echo isset($_POST['username']) 
                        ? htmlspecialchars($_POST['customerid'])
                        : ''; ?>" 
            />
            <?php echo $customerIDError ?></td>
        <td style="color:red"></td>
    </tr>
    </table>
    <p>
        <input type="submit" name = "submit" value="Save Data"/> 
        <input type="reset" value="Reset Form" />
    </p>
</form>

</body>
</html>

Answer 1

你可以先使用jquery来定义

＆＃13;

$("#submit").click(function(){
  $("#custinfo1").show();
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <title>Prac 2 Task 12</title>
</head>

<body>
  <form method="post" action="<?php echo $_SERVER[PHP_SELF]; ?> " id="custinfo">
    <table>
      <tr>
        <td>
          <label for="customerid">Customer ID (integer value):</label>
        </td>
        <td>
          <input type="text" id="customerid" name="customerid" size="10" value="" />
          <?php echo $customerIDError ?>
        </td>
        <td style="color:red"></td>
    </table>
    <p>
      <input type="submit" name="submit" value="Save Data" id="submit" />
      <input type="reset" value="Reset Form" />
    </p>
    </tr>
  </form>
  <form method="post" action="<?php echo $_SERVER[PHP_SELF];?>" id="custinfo1" style="display:none">
    <table>
      <tr>
        <td>
          <label for="username">Username:</label>
        </td>
        <td>
          <input type="text" id="username" name="username" size="10" value="" />
          <?php echo $customerIDError ?>
        </td>
        <td style="color:red"></td>
    </table>
    <p>
      <input type="submit" name="submit" value="Save Data" />
      <input type="reset" value="Reset Form" />
    </p>
    </tr>
  </form>
</body>

</html>

＆＃13;

检查此代码

Answer 2

我纠正了你的代码，只是运行它

 <!DOCTYPE html>
            <html>
            <head>
            <title>Prac 2 Task 12</title>
            <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
            <style>
                    #form2{display: none;}
            </style>
            </head>

            <body>
            <form method="post" action="<?php echo $_SERVER["PHP_SELF"];?>" id="form1" >
            <table>
            <tr>
                    <td><label for="customerid">Customer ID (integer value): </label></td>
                    <td><input type="text" id="customerid" name="customerid" size="10" value = "<?php echo isset($_POST['customerid']) ? htmlspecialchars($_POST['customerid']):''; ?>" /><?php echo $customerIDError ?></td>
                    <td style="color:red"></td>
            </table>
                <p><input type="submit"  id="form1submitbtn" name = "submit" value="Save Data"/> <input type="reset" value="Reset Form" /></p>
            </tr>
            </form>

            <form method="post" action="<?php echo $_SERVER["PHP_SELF"];?>" id="form2" >
            <table>
            <tr>
                    <td><label for="username">Username: </label></td>
                    <td><input type="text" id="username" name="username" size="10" value = "<?php echo isset($_POST['username']) ? htmlspecialchars($_POST['customerid']):''; ?>" /><?php echo $customerIDError ?></td>
                    <td style="color:red"></td>
            </table>
                <p><input type="submit" name = "submit" value="Save Data"/> <input type="reset" value="Reset Form" /></p>
            </tr>
            </form>
                <script>
                    $(document).ready(function(){
                     $("form1submitbtn").click(function(){
                        $("#form2").show();
                    });
                    });
   
                </script>
            </body>
            </html>

按提交后，我希望它显示第二个表单

2 个答案: