2013-03-17 71 views
0

在此先感謝您的幫助。我知道這可能是一個簡單的問題,因爲我對HTML比較陌生。如何處理HTML表單提交

我在我的網站上有一個表格供人們成爲會員..我希望用戶輸入他們的信息並點擊提交。當他們這樣做時,我想要一封電子郵件發送給我。但是,我希望將用戶重定向到網站上他們將爲其成員付費的其他網頁。我怎麼能同時做這兩件事(發送電子郵件,重定向)?

這裏是我的形式:

<form> 
First name: <input type="text" name="firstname"> 
Last name: <input type="text" name="lastname"><br> 
Street: <input type="text" name="street" size="60"><br> 
City: <input type="text" name="city"> 
State: <input type="text" name="state"> 
ZIP: <input type="text" name="zip"><br> 
Email: <input type="text" name="email" size="60"><br> 
Phone: <input type="text" name="phone" size="60"><br> 
City/Township: <input type="text" name="votingcity"> 
Precinct No.: <input type="text" name="precinct"><br> 
<br><hr><br> 
<p>Government regulations require the following information:<br></p><br> 
Occupation: <input type="text" name="occupation" size="60"><br> 
Employer's Name: <input type="text" name="employer" size="60"><br> 
Employer's Street: <input type="text" name="emp_street" size="60"><br> 
Employer's City: <input type="text" name="emp_city"> 
Employer's State: <input type="text" name="emp_state"> 
Employer's ZIP: <input type="text" name="emp_zip"><br> 
<br><hr><br> 
Submit <input type="submit"> 
</form> 
+1

你必須使用任何類似PHP語言的發送電子郵件或重定向 – 2013-03-17 16:29:48

回答

0

我建議你去看看PHP的教程(參見:php.net)的。下面的代碼將您重定向到一個「action.php的」頁面,在這裏你將可以執行PHP代碼(發送電子郵件,重定向到另一個,等等)

的index.html

<form action="action.php" method="post"> 
<p>Your name: <input type="text" name="name" /></p> 
<p>Your age: <input type="text" name="age" /></p> 
<p><input type="submit" /></p> 
</form> 

行動.PHP

<?php 
$message = "your message"; 

// Send mail 
mail('[email protected]', 'Your Subject', $message); 

header('Location: payment.php'); 
?> 

UPDATE: 在你的PHP頁面,您還可以管理您的表單數據。例如,您可以通過此$_POST['firstname']訪問用戶的名字。或者在您顯示用戶信息payement頁面這樣的:

Hi M. <?php echo htmlspecialchars($_POST['lastname']); ?>. 

我不知道你想用表單數據做什麼,而是你可以在電子郵件發送或存儲它們在數據庫中。

您也可以使用PHP以外的其他語言,如Java,VB.net等。但在我看來,PHP可能會更容易學習。

+0

你的JavaScript代碼不啓動電子郵件;它只會將用戶發送到後續頁面。 – mikemxm 2013-03-17 17:11:06

+0

而你的PHP對錶單數據沒有任何作用 – mikemxm 2013-03-17 17:13:46

+0

你是對的,javascript並沒有真正發送電子郵件,它會打開默認的電子郵件客戶端並預先填充內容。 否則,我更新我的答案,添加更多關於php處理表單的細節。 – Pith 2013-03-17 18:18:50

0

您應該使用服務器端頁面進行表單操作以發送電子郵件並顯示會員頁面。當用戶提交表單時,他們將被定向到此頁面。

<form method="post" action="link to subscription page. Eg: payment.php"> </form>

在payment.php,顯示付款的形式,寫來發送電子郵件的功能。

<?php 
//Write send email function here 
?> 
<html> 
<!-- Display payment form here --> 
</html> 
0

這不能只用HTML來完成,你需要知道服務器端腳本語言如PHP或ASP。

0

您是如何處理付款的?如果我爲自己做這件事,我可能會將表單數據發送到付款處理器(例如PayPal)幷包含在發票中。我想大多數支付處理器都有一個選項可以在收到付款時通過電子郵件通知您。

但你沒有問過如何會這樣做,你問你如何提交表單,以便發送電子郵件和瀏覽器被重定向到另一個頁面。

如果你不能使用我的解決方案,我真的認爲你最好將PHP投入混合。

註冊。HTML

<form action="process.php" method="post"> 
First name: <input type="text" name="firstname"> 
Last name: <input type="text" name="lastname"><br> 
Street: <input type="text" name="street" size="60"><br> 
City: <input type="text" name="city"> 
State: <input type="text" name="state"> 
ZIP: <input type="text" name="zip"><br> 
Email: <input type="text" name="email" size="60"><br> 
Phone: <input type="text" name="phone" size="60"><br> 
City/Township: <input type="text" name="votingcity"> 
Precinct No.: <input type="text" name="precinct"><br> 
<br><hr><br> 
<p>Government regulations require the following information:<br></p><br> 
Occupation: <input type="text" name="occupation" size="60"><br> 
Employer's Name: <input type="text" name="employer" size="60"><br> 
Employer's Street: <input type="text" name="emp_street" size="60"><br> 
Employer's City: <input type="text" name="emp_city"> 
Employer's State: <input type="text" name="emp_state"> 
Employer's ZIP: <input type="text" name="emp_zip"><br> 
<br><hr><br> 
Submit <input type="submit"> 
</form> 

process.php

<?php 
    $message = ''; 
    foreach($_POST as $key => $value) { 
    $message .= "$key => $value\n"; 
    } 
    mail('[email protected]','New User Registration',$message); 
    header('Location: payment.html'); 
?> 

確保<?php是process.php的開始;沒有任何前面的文本或任何類型的空白。

您會收到看起來像這樣的電子郵件:

firstname => Homer 
lastname => Simpson 
street => 724 Evergreen Terrace 
city => Springfield 
state => Unknown 
zip => ????? 
email => [email protected] 
phone => (939) 555-0113 
votingcity => Springfield 
precinct => N/A 
occupation => Nuclear Safety Inspector 
employer => C. Montgomery Burns 
emp_street => 100 Industrial Way 
emp_city => Springfield 
emp_state => Unknown 
emp_zip => ????? 
1

在你的開場白試試這個它可以在HTML做它不漂亮,但它可能會爲你

<form action="MAILTO:[email protected]" method="post" enctype="text/plain"> 
0
工作

所有操作都將在服務器端進行。所以你必須使用任何服務器端語言。在你的情況下,PHP將是合適的。驗證所有字段後,您可以從HTML表單發送數據。你可以用ajax或傳統的方式發送它,如果你收到迴應,那麼你可以移動到下一頁。

使用jQuery forminteract,您可以在您的HTML輸入中添加驗證標記,正如我在下面名字中所用的那樣。

<form action="process.php" method="post"> 
    First name: <input type="text" name="firstname" data-validation-notNull data-validation-notNull-message="Please enter first Name"> 
<span data-error="firstName"></span> 
    Last name: <input type="text" name="lastname"><br> 
    Street: <input type="text" name="street" size="60"><br> 
    City: <input type="text" name="city"> 
    State: <input type="text" name="state"> 
    ZIP: <input type="text" name="zip"><br> 
    Email: <input type="text" name="email" size="60"><br> 
    Phone: <input type="text" name="phone" size="60"><br> 
    City/Township: <input type="text" name="votingcity"> 
    Precinct No.: <input type="text" name="precinct"><br> 
    <br><hr><br> 
    <p>Government regulations require the following information:<br></p><br> 
    Occupation: <input type="text" name="occupation" size="60"><br> 
    Employer's Name: <input type="text" name="employer" size="60"><br> 
    Employer's Street: <input type="text" name="emp_street" size="60"><br> 
    Employer's City: <input type="text" name="emp_city"> 
    Employer's State: <input type="text" name="emp_state"> 
    Employer's ZIP: <input type="text" name="emp_zip"><br> 
    <br><hr><br> 
<button type="button" id="btn-submit">Submit</button> 
    </form> 

JavaScript在頁面底部會是。

var form=$("form").find("[name]").formInteract(); 
$("#btn-submit").click(function(){ 
    if(!form.validate()){ 
     //return if form is not valid 
     return; 
    } 

form.postAjax("url", function(rsp){ 
//do your stuff with response. 

}); 

}); 

這裏是臨客,以forminteract項目 https://bitbucket.org/ranjeet1985/forminteract

+0

你應該提到這是你自己的個人插件。 – Johannes 2015-05-18 16:23:18