更新

Question

我正在使用来自http://granot.com/的网站上的表单，这是一个用于移动公司的CRM软件。此表单基本上是一个估计请求，它在CRM数据库中写入一些内容。

不幸的是，它不会发送电子邮件通知，因此问题是是否可以在表单中附加通知功能，而不会影响其原始用途。哪种方法最优雅。

以下是Granot 提供它的方式（我知道它可以通过许多其他方式进行改进，但现在不是我的问题）：

<form name="theForm" method="post">
<input type="HIDDEN" name="MODULE" value="EST">
<input type="HIDDEN" name="REF" value="WEBSITE">   
<div align="center">
  <center>   
<table width="500" border="0" cellspacing="1" cellpadding="2" bordercolor="#03346C" style="border-collapse: collapse">  
  <tr>
   <td height="9" width="177"><b><font face="Verdana" size="2">Customer Name:</font></b></td>
   <td height="9" width="303"><input type="text" class="textFeilds" name="SNAME" size="20" style="border: 1px solid #000000; " tabindex="1"></td>
  </tr>
  <tr>
   <td height="10" width="177"><b><font face="Verdana" size="2">Customer Email:</font></b></td>
   <td height="10" width="303"><input type="text" class="textFeilds" name="EMAIL" size="20" style="border: 1px solid #000000; " tabindex="2"></td>
  </tr>
  <tr>
   <td height="12" width="177"><b><font face="Verdana" size="2">Contact Phone:</font></b></td>
   <td height="12" width="303"><input type="text" class="textFeilds" name="STELH" size="20" style="border: 1px solid #000000; " tabindex="3"></td>
  </tr>
  <tr>
   <td height="15" width="177"><b><font face="Verdana" size="2">Moving Date:</font></b></td>
   <td height="15" width="303">
                        <select name="MM" id="MM" tabindex="5">
                          <option value="" selected>Month</option>
                          <option value="January">January</option>
                          <option value="February">February</option>
                          <option value="March">March</option>
                          <option value="April">April</option>
                          <option value="May">May</option>
                          <option value="June">June</option>
                          <option value="July">July</option>
                          <option value="August">August</option>
                          <option value="September">September</option>
                          <option value="October">October</option>
                          <option value="November">November</option>
                          <option value="December">December</option>
                        </select><select name="DD" class="textFeilds3" id="DD" tabindex="6">
                          <option  selected value="">Day</option>
                          <option value="1">1</option>
                          <option value="2">2</option>
                          <option value="3">3</option>
                          <option value="4">4</option>
                          <option value="5">5</option>
                          <option value="6">6</option>
                          <option value="7">7</option>
                          <option value="8">8</option>
                          <option value="9">9</option>
                          <option value="10">10</option>
                          <option value="11">11</option>
                          <option value="12">12</option>
                          <option value="13">13</option>
                          <option value="14">14</option>
                          <option value="15">15</option>
                          <option value="16">16</option>
                          <option value="17">17</option>
                          <option value="18">18</option>
                          <option value="19">19</option>
                          <option value="20">20</option>
                          <option value="21">21</option>
                          <option value="22">22</option>
                          <option value="23">23</option>
                          <option value="24">24</option>
                          <option value="25">25</option>
                          <option value="26">26</option>
                          <option value="27">27</option>
                          <option value="28">28</option>
                          <option value="29">29</option>
                          <option value="30">30</option>
                          <option value="31">31</option>
                        </select><select name="YY" class="textFeilds3" id="YY" tabindex="7">
                          <option value="2014" selected>2014</option>
                          <option value="2015">2015</option>
                        </select></td>
  </tr>    
  <tr>
   <td height="15" width="177"><b><font face="Verdana" size="2">Moving From Zip Code:</font></b></td>
   <td height="15" width="303"><input type="text" class="textFeilds" name="SZIP" size="7" style="border: 1px solid #000000;" tabindex="8"></td>
  </tr>
  <tr>
   <td height="17" width="177"><b><font face="Verdana" size="2">Moving To Zip Code:</font></b></td>
   <td height="17" width="303"><input type="text" class="textFeilds" name="RZIP" size="7" style="border: 1px solid #000000;" tabindex="9">
   <b><font face="Verdana" size="1"><a href="javascript:locatezip()">Locate Your Zip Code</a></font></b></td>
  </tr>
  <tr>
   <td height="19" width="177"><b><font face="Verdana" size="2">Volume:</font></b></td>
   <td height="19" width="303">
   <select name="ROOMS" class="textFeilds3" tabindex="10" style="border: 2px solid; padding-left: 4; padding-right: 4; padding-top: 1; padding-bottom: 1; ">
                            <option selected>< Select weight of move></option>
                            <option value="STU">Studio</option>
                            <option value="ONE">One bedroom</option>
                            <option value="TWO">Two bedrooms</option>
                            <option value="THR">Three bedrooms</option>
                            <option value="FOU">Four bedrooms</option>
                            <option value="FIV">Five bedrooms</option>
                            <option value="SIX">Six bedrooms and more</option>
                      </select></td>
  </tr>
  <tr> 
   <td height="44" colspan="2" align="center" width="485"><br><input type="button" name="btnSubmit" onclick="SubmitEntry()" style="background-color:#083484; width:125; height:25; font-family:Verdana; font-size:10pt; font-weight:bold;color:#FFFFFF;CURSOR:HAND;" value="Get Your Quote" tabindex="10"></td>
 </tr>  
</table>
  </center>
</div>
</form>

它带有一些验证JavaScript，但我不认为这在这里非常重要。从来没有：

<script language="JavaScript" src="http://gorilla.hellomoving.com/XXXXX/formcheck.js"> </script>
<script language="JavaScript" type="text/JavaScript">


function checkData(){
    frm = document.theForm;
    return lengthValid(frm.SNAME, 4,"full name") 
    && emailValid(frm.EMAIL, 4,"Email")
    && lengthValid(frm.STELH, 10,"ten digits phone number")
    && selectValid(frm.MM, "month") 
    && selectValid(frm.DD, "day")   
    && zipValid(frm.SZIP, 5, "five digits origin zip code -US only") 
    && zipValid(frm.RZIP, 5, "five digits destination zip code - US only")
    && selectValid(frm.ROOMS,"weight")
    }

function SubmitEntry() {
        if (checkData()) {
            document.theForm.action="http://gorilla.hellomoving.com/wc.dll?mpdir~moduleret~XXXXX";
            document.theForm.submit();
            }
      }  

function locatezip() {
    window.open('http://gorilla.hellomoving.com/wc.dll?mputil~zipwc~NEW','EANITHING','toolbar=no,location=no,directories=no,status=no,menubar=no,resizable=no,copyhistory=no,scrollbars=yes,width=550,height=500');
self.name="main"}
</script>

我期待着想法 - 提前感谢！

更新

根据第一个答案我尝试了以下（Spoiler：遗憾的是没有成功）：

我在网站根文件夹中创建了一个email.php，其中包含

<?php
if($_POST){
    mail("admin@domain.com", "The form has been filled out", "Head over to Granot and check it out");
}
?>

我尝试通过将以下内容直接放入表单所在的页面（如果重要的话，在表单上方）来触发它。基于@Flynn建议的解决方案，结合this question的复制和粘贴。

<script>

function SubmitEntry() {
    if (checkData()) {
        document.theForm.action="http://gorilla.hellomoving.com/wc.dll?mpdir~moduleret~XXXXX";
        document.theForm.submit();

       $.ajax({
            type: "POST",
            url: "/email.php",
            data: dataString,
        });
        }
  }
</script>

控制台不会吐出任何脚本错误。什么提示我做错了什么？谢谢！

Answer 1

遗憾的是，我无法直接从Javascript发送电子邮件。

但是，您可以使用对服务器的AJAX调用并使用它来发送电子邮件。

function SubmitEntry() {
    if (checkData()) {
        document.theForm.action="http://gorilla.hellomoving.com/wc.dll?mpdir~moduleret~XXXXX";
        document.theForm.submit();
        // Insert AJAX call here
        }
  }

我不知道您使用的是哪些Javascript库，但使用jQuery

可以很简单地调用AJAX

HTML表单：通过jQuery和PHP邮件发送其他通知电子邮件

更新

1 个答案: