Question

我目前有两种形式，当点击两个不同的按钮时会出现。因此，当单击按钮a时，会出现按钮b，并且按钮a仍然在屏幕上。我希望在页面加载时，两个按钮是并排的。此外，当我提交表单A的表单数据时，它可以工作并进入我想要的屏幕的左上角，但是当我提交表单B时，当我单击按钮时，表单B中的数据出现在最后一个输入字段下面A显示按钮A的形式。我希望当我提交表单b时，它的数据会显示在已经添加到网页的数据下面，当我点击按钮a来输入表单时，不是在表单下面数据形成一个输入字段。

<!DOCTYPE html>
<html>
<head>
    <title>Home</title>
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="index.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
</head>
<body>

</body>
</html>
<div id="formData" >
<?php
#FOR THE DRIVERS ONLY 
session_start();

if (isset($_POST['clear'])) {
    $_SESSION['inputs'] = array();
}
if (!empty($_POST['name']) && !empty($_POST['age'])  && !empty($_POST['departLoc']) 
    && !empty($_POST['arriveLoc']) && !empty($_POST['departDate'])  && !empty($_POST['returnDate']) 
    &&  !empty($_POST['desiredNum'])) {
    if (!isset($_SESSION['inputs'])) {
        // initialize the saved input session variable the first time
        $_SESSION['inputs'] = array();
    }
    $_SESSION['inputs'][] = $_POST;
    foreach ($_SESSION['inputs'] as $input) {
        echo " <p class='driverAlert' > DRIVER </p> <img src='taxi.png'  width ='50' height='50'title='driver'> <span class='trip'> {$input['name']}, Age: {$input['age']} <br> Is planning to go to {$input['arriveLoc']} from {$input['departLoc']}<br>
         Leaves on {$input['departDate']} and returns on {$input['returnDate']} <br> Will drive up to: {$input['desiredNum']} people <br> <br></span> 
         ";
    }
}
?>
 </div>
<input class="btn btn-default" type="button" id="driverbtn"value="Driver">
<div id="driver">

<form action="index.php" id="driverForm" method="post" class="form-inline">
 <div class="form-group">
    <input type="text" class="form-control input-sm" id="desireNum" name="desiredNum" placeholder="Number of potential riders">
  </div><br> <br>

  <div class="form-group">
    <input type="text" class="form-control input-sm" id="name" name="name" placeholder="Enter Name">
  </div><br> <br>

  <div class="form-group">   
    <input type="text" class="form-control input-sm" id="age" name="age" placeholder="Enter Age">
  </div> <br> <br>

   <div class="form-group">

    <input type="text" class="form-control input-sm" id="depart" name="departLoc" placeholder="Departure Location">
  </div><br> <br>

   <div class="form-group">

    <input type="text" class="form-control input-sm" id="arrive" name="arriveLoc" placeholder="Destination Location">
  </div><br> <br>

   <div class="form-group">

    <input type="date" class="form-control input-sm" id="departDate" name="departDate" placeholder="Depart Date">
  </div><br> <br>

   <div class="form-group">

    <input type="date" class="form-control input-sm" id="returnDate" name="returnDate" placeholder="Return Date">
  </div><br> <br>


<input class="btn btn-default" type="submit" value="Submit"> <input class="btn btn-default" title="Clear page content"type="submit" name="clear" value="Clear">
</form>

<!-- Creates form for Riders -->
<div id="formData2" >
<?php
#FOR THE DRIVERS ONLY 

if (isset($_POST['clear'])) {
    $_SESSION['inputs2'] = array();
}
if (!empty($_POST['nameTwo']) && !empty($_POST['ageTwo'])  && !empty($_POST['departLocTwo']) 
    && !empty($_POST['arriveLocTwo']) && !empty($_POST['departDateTwo'])  && !empty($_POST['returnDateTwo'])) {
    if (!isset($_SESSION['inputs'])) {
        // initialize the saved input session variable the first time
        $_SESSION['inputs2'] = array();
    }
    $_SESSION['inputs2'][] = $_POST;
    foreach ($_SESSION['inputs2'] as $input) {
        echo " <span class='tripTwo'> <p class='riderAlert' > PASSENGER </p> <img src='rider.png'  width ='50' height='50'title='rider'> {$input['nameTwo']}, Age: {$input['ageTwo']} <br> Would like to go to {$input['departLocTwo']} from {$input['arriveLocTwo']} on {$input['departDateTwo']} and return on 
         {$input['returnDateTwo']}  <br> <br></span> 
         ";
    }
}
?>
 </div>
 <input class="btn btn-default" type="button" id="riderbtn"value="Passenger">
<div id="rider">

<form action="index.php" id="riderForm" method="post" class="form-inline">

  <div class="form-group">
    <input type="text" class="form-control input-sm" id="nameTwo" name="nameTwo" placeholder="Enter Name">
  </div><br> <br>

  <div class="form-group">   
    <input type="text" class="form-control input-sm" id="ageTwo" name="ageTwo" placeholder="Enter Age">
  </div> <br> <br>

   <div class="form-group">

    <input type="text" class="form-control input-sm" id="departLocTwo" name="departLocTwo" placeholder="Departure Location">
  </div><br> <br>

   <div class="form-group">

    <input type="text" class="form-control input-sm" id="arriveLocTwo" name="arriveLocTwo" placeholder="Destination Location">
  </div><br> <br>

   <div class="form-group">

    <input type="date" class="form-control input-sm" id="departDateTwo" name="departDateTwo" placeholder="Depart Date">
  </div><br> <br>

   <div class="form-group">

    <input type="date" class="form-control input-sm" id="returnDateTwo" name="returnDateTwo" placeholder="Return Date">
  </div><br> <br>


<input class="btn btn-default" type="submit" value="Submit"> <input class="btn btn-default" title="Clear page content"type="submit" name="clear" value="Clear">
</form>
<script type="text/javascript">
    $('#riderbtn').click(function()
    {
        $('#rider').toggle();
    });
</script>

 <!--- End of rider data -->
<script type="text/javascript">
    $('#driverbtn').click(function()
    {
        $('#driver').toggle();
    });

</script>

</div>

Answer 1

当用户提交表单时，将输入附加到会话变量，并显示变量中的所有已保存值。

setFixedSize()

如何将表单数据附加到同一页面？

1 个答案: