1表單2用captcha提交按鈕

Question

我正在預訂頁面表單上工作。我想要一個客戶填寫他們的信息的單一表格，以及底部的兩個提交按鈕：一個保留72小時的預訂，另一個允許他們現在預訂並繼續到結賬頁面。第一個按鈕應該通過電子郵件將數據發送給我，然後將用戶重定向到靜態html頁面。第二個按鈕還應通過電子郵件將數據發送給我，然後將用戶重定向到結帳頁面。

首先，這種方式有兩個提交按鈕甚至可能嗎？我看到有關同意/不同意按鈕的帖子，其中不同意按鈕或多或少地取消了表格，並且同意按鈕傳遞數據。我需要兩個按鈕來傳遞數據，但需要使用不同的後置操作。

二，我有一個免費的captcha插入到我的表單;我厭倦了在我的電子郵件收件箱中獲取bot表單返回。我有1個提交按鈕可以工作的驗證碼。但我完全喪失瞭如何用兩個提交按鈕來實現驗證碼。

這裏是我的代碼，與驗證碼和一個工作提交按鈕（另一個按鈕還沒有「上鉤」並工作）：

<h2>Traveler Information</h2> 
<form action="http://www.SnapHost.com/captcha/send.aspx" method="post" id="mpNOV"> 
    <input type="hidden" id="skip_WhereToSend" name="skip_WhereToSend" value="my@email.com" /> 
    <input type="hidden" id="skip_Subject" name="skip_Subject" value="Reservation" /> 
    <input type="hidden" id="skip_WhereToReturn" name="skip_WhereToReturn" value="confirm.shtml" /> 
    <input type="hidden" id="skip_SnapHostID" name="skip_SnapHostID" value="xxx" /> 

<!-- form start --> 
    <table width="558" border="0" cellpadding="2" cellspacing="0"> 
     <tr> 
     <td width="214" align="right"># of Travelers</td> 
     <td width="344"> 
      <select name="travelers" id="travelers"> 
       <option value="1" selected="selected">1</option> 
       <option value="2">2</option> 
      </select> 
     </td> 
     </tr> 

     <tr> 
     <td align="right">Room type</td> 
     <td valign="top"> 
      <select name="room" id="room"> 
       <option value="" selected="selected">Select...</option> 
       <option value="single">Single (1 bed)</option> 
       <option value="double">Double (2 beds)</option> 
       <option value="doublePlus">Superior Double (2 beds)</option> 
      </select> 
     </td> 
     </tr> 
    </table> 
<!-- form end --> 

<!-- captcha start --> 
<table border="0" align="center" cellpadding="2" cellspacing="0" style="background-color:#b9558b;"> 
    <tr valign="bottom"> 
     <td style="padding: 0 4px 8px 8px;"> 
     <a href="#" onclick="return ReloadCaptchaImage('CaptchaImage');" style="font-size:11px;color: #000;">reload image</a><br /> 
     <a href="http://www.SnapHost.com"><img id="CaptchaImage" alt="Captcha Code" style="border-width:0px;" title="This Captcha image is intended to prevent spam. The Captcha code is generated by an online form processor. To submit this form, enter the code into the text field. For more information click on the Captcha image." src="http://www.SnapHost.com/captcha/CaptchaImage.aspx?id=PR64FH7HK8F7" /></a> 
     </td> 

     <td style="padding: 0 8px 8px 4px;"> 
     <span style="color: #fff;"><i>Enter security code:</i></span><br /> 
     <input id="skip_CaptchaCode" name="skip_CaptchaCode" type="text" style="width:130px; height:64px; font-size:38px;" maxlength="6" /> 
     </td> 
    </tr> 

    <tr> 
     <td colspan="2" align="center" style="background-color: #fff;"> 
     <a href="http://www.SnapHost.com" style="text-decoration:none; font-size:11px; font-family:Verdana, Arial, Helvetica; color:#000099;">This web form is protected from SPAM by <span style="text-decoration:underline;">SnapHost.com</span></a></td> 
    </tr> 
</table> 

<script type="text/javascript"> 
function ReloadCaptchaImage(captchaImageId) 
{ 
    var obj = document.getElementById(captchaImageId); 
    var src = obj.src; 
    var date = new Date(); 
    var pos = src.indexOf('&rad='); 

    if (pos >= 0) 
    { 
     src = src.substr(0, pos); 
    } 

    obj.src = src + '&rad=' + date.getTime(); 
    return false; } 
</script> 

<!-- end captcha --> 
<!-- start submit buttons --> 
<table width="558" border="0" cellspacing="0" cellpadding="2"> 
    <tr> 
     <td width="55%" align="right" style="padding-top:10px; padding-bottom:10px; border-top: 1px solid #6f3957;"> 
     <input type="submit" name="bookMP-nov" value="Hold my reservation" class="submit" /> 
     </td> 

     <td width="45%" style="padding-top:10px; padding-bottom:10px; border-top: 1px solid #6f3957;"> 
     <input type="submit" name="bookMP-nov" value="Book Now!" class="submit" /> 
     </td> 
    </tr> 
</table> 
<!-- end submit buttons --> 

可以使用的驗證碼上多次根據他們的網站，同一個頁面。我非常喜歡SnapHost.com上使用的圖像，我的許多客戶都會更老，而且這些是我遇到的最簡單的圖像，所以我希望我可以繼續使用SnapHost，並且仍然完成我的雙重提交按鈕需求。 （A）如果這是可行的，並且（B）從哪裏開始編碼將一起工作的雙提交按鈕/驗證碼，我非常感謝幫助！我不確定是否需要php（我什麼都不知道）或者javascript或jQuery（我知道一些）或者其他的東西。謝謝！！

---

UPDATE

---

我嘗試這個代碼，而它重定向到正確的頁面，驗證碼不驗證，我的表單結果不被髮送回給我。讓我的希望暫時過去了，只是爲了重新回到地球！

<input type="submit" onclick="var e = document.getElementById('mpNOV'); e.action='mp-NOVconfirm.shtml'; e.submit();" value="Hold my reservation" class="submit"></td> 
<td width="45%" style="padding-top:10px; padding-bottom:10px; border-top: 1px solid #6f3957;"> 
<input type="submit" onclick="var e = document.getElementById('mpNOV'); e.action='../../index.shtml'; e.submit();" value="Book Now!" class="submit"> 

我也刪除了這個

input type="hidden" id="skip_WhereToReturn" name="skip_WhereToReturn" value="http://www.happywivestravel.com/tours/machupicchu/mp-NOVconfirm.shtml" 

代碼形式的頂部，以爲它會與輸入標籤的onClick功能所取代，但很明顯的是，這裏不是答案。

我曾希望有一個很好的簡單修復方法，但事實並非如此。任何有其他想法的人？

Answer 1

更新： 檢查你的代碼，問題和答案，我再次來到了這一點：

的Javascript：

<head> 
<script type='text/javascript' > 
    function validateReservation() 
    { 
    //You can validate your captcha here 
    document.forms['mpNOV'].submit(); //this submits the form 
    } 

    function validateBooking() 
    { 
    //You can validate your captcha here 
    document.forms['mpNOV'].submit(); //this submits the form 
    } 
</script> 
</head> 

的這部分代碼去哪裏表單的謊言，我在頁面上不習慣使用驗證碼，所以我希望你可以自己弄清楚驗證。

原始代碼：

<form action="http://www.SnapHost.com/captcha/send.aspx" method="post" id="mpNOV"> 

更改：

<form action="http://www.SnapHost.com/captcha/send.aspx" method="post" name="mpNOV" id="mpNOV"> 

我爲了與它使用document.forms互動增加了一個名字你<form>元素。 此外，我注意到您在<form>中的操作轉到了SnapHost.com。這意味着您的網站將被重定向到SnapHost.com，您應該在那裏使用$_POST獲取信息。由於這可能不是您的網站，因此您應該找出另一種方法在您的網站上使用SnapHost圖像，而不重定向到SnapHost.com。

如果這是您的網站，那麼您可以使用此PHP代碼來獲取數據填充形式：

<head> 
     <?php 
     if($_SERVER['REQUEST_METHOD'] === 'POST') //This if statement checks wether there's been a $_POST request... 
     { 
      if(isset($_POST['Reservation']) //Is the Reservation button clicked? 
      { 
       //You can get your data here using $_POST 
      } 

      if(isset($_POST['Booking']) //Is the Booking button clicked? 
      { 
       //You can get your data here using $_POST 
      } 
     } 
     ?> 
</head> 

的isset語句檢查閹的變量，或者在這種情況下，按鈕已經被「設置」。所以如果你點擊你的「保留」按鈕，if聲明就會看到「保留」按鈕已被設置。

代碼的PHP部分進入您的<form action>重定向到的頁面的<head>。

HTML：

<td> 
    <input type="button" onClick="validateReservation();" value="Hold my reservation" class="submit" name="Reservation" /> 
</td> 
<td width="45%" style="padding-top:10px; padding-bottom:10px; border-top: 1px solid #6f3957;"> 
    <input type="button" onclick="validateBooking();" value="Book Now!" class="submit" name="Book /> 
</td> 

請注意，我添加了一個名字上面提交按鈕，也請注意，你應該總是密切<input>元素與/>標籤。我相信這是W3C標準。 此外，到目前爲止，我讀過一個提交按鈕不能有一個Click功能，但我不太確定這一點。

如果需要使用PHP &獲取數據的幫助下，$ _ POST方法請看：Here。

注意stackoverflow.com不是給你寫完整代碼的，搜索網頁，並使用谷歌先走，如果你不能在這之後弄清楚，問這裏。

我希望這可以幫助你。

如果您有任何問題，隨時問！