[英]How to receive results from an HTML form on same page
我正在為我的一個課程編寫一個項目,本質上是一些 HTML 網頁都在本地文件夾中工作。 其中一個頁面是一個表單,該項目要求我們在各自的字段旁邊顯示表單的結果。 但是,我不確定該怎么做。 代碼大致如下(抱歉我的縮進錯誤)。
<!DOCTYPE html>
<html>
<head>
<title>Reservation Form</title>
<b>
<a href=index.html>Home</a>
<a href=yurts.html>Yurts</a>
<a href=#>Activities</a>
<a href=reservations.html>Reservations</a>
</b>
<style type="text/css">
div{
height: 705px;
width: 500px;
border: 2px solid red;
margin: 200px;
padding: 10px;
}
a:link{
padding-right 10px;
font-size: 18px;
color: 2309CA;
}
a:active{
color: #66027C
}
</style>
</head>
<body>
<div>
<h2>Reservations</h2>
<p style="font size: 20px;"><b>Contact Us Today!</b></p>
<h2>Reservations Form</h2>
<form>
<table>
<tr>
<td>
<label for="First-name">First Name:</label></td>
<td><input type="text" id="First-name" name="First-name"required ></td>
</tr>
<tr>
<td>
<label for="lname">Last Name:</label></td>
<td><input type="text" id="lname" name="lname"required ></td>
</tr>
<tr rowspan="2">
<td><b>Address</b></td>
</tr>
<tr>
<td><label>Number & Street:</label></td>
<td><input type="text" name="Name and Street" required></td>
</tr>
<tr>
<td><label >City:</label></td>
<td><input type="text" name="city" required></td>
</tr>
<tr>
<td><label >State:</label></td>
<td><name="state" required>
<select>
<option value="Placeholder">Please Select</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District Of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr>
<td><label >Zip Code:</label></td>
<td><input type="Number" name="city" required></td>
</tr>
<tr>
<td><label >Check-in Date:</label></td>
<td><input type="date" name="Check-in" required></td>
</tr>
<tr>
<td><label >Check-out Date:</label></td>
<td><input type="date" name="Check-out" required></td>
</tr>
<tr>
<td><label >Number of People:</label></td>
<td><input type="Number" name="Number of People" required></td>
</tr>
<tr>
<td> <label >Phone:</label></td>
<td><input type="text" name="phone" placeholder="(###)###-####" required>
<span class="ExampleNumber">(###)###-####</span>
</td>
</tr>
<tr>
<td><label >E-mail Address:</label></td>
<td><input type="Email" name="email" placeholder="name@domain.com" required></td>
</tr>
<tr>
<td> <label >Payment Method:</label></td>
<td><name="payment" required>
<select>
<option value="Placeholder">Please Select</option>
<option value="MC">MasterCard</option>
<option value="VISA">Visa</option>
<option value="AMEX">American Express</option>
<option value="DS">Discover</option>
</td>
</tr>
<tr>
<td><label >Card Number:</label></td>
<td><input type="Number" name="cc" required></td>
</tr>
<tr>
<td><label ><b>Special Request:</b></label></td>
<td ><textarea style="width:130%;height: 300%">Enter your request here</textarea> </td>
</tr>
</table>
<input type="submit" value="Submit">
<button>Clear</button>
</form>
<p>
Resort<br/>Street Address<br/>State ZIP<br/>Phone<br/><br/>
<em>Copyright © 2020 Resort<br/>
<a>example@domain.com</a></em>
</p>
</div>
</body>
</html>
本質上,我希望結果以與輸入方式類似的方式顯示在提交后的同一頁面上。 我對 PHP 或 CSS 也不是太好,如果是的話我可能已經弄明白了。 任何幫助都將不勝感激。
在您的表單中,您必須將 action 屬性指向同一個文件。
然后在同一個文件中,您可以根據輸入的名稱使用 PHP 超級全局 $_POST 打印輸入的值,如下所示:
<form action ="yourFile.php" method="POST"> <?--All your html here--> <input type="text" name="yourFirstInput"> <?php echo isset($_POST['yourFirstInput']): $_POST['yourFirstInput']; ''? ?> </form>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.