经典ASP - 使用Ajax提交查询表单而无需刷新

Question

我已经看了谷歌等,但找不到我想要的东西,所以要求我的SE成员帮忙.

我的表单包含在我的页面上,并且在整个站点中都是一致的.我想提交没有页面刷新的查询表格,这是经典ASP的正常路线.

我有一个单独的ASP页面,其中包含我的邮件脚本,并且工作正常并发送电子邮件,但是我想使用Ajax来调用该页面,发送电子邮件然后通知用户它已被发送.

任何帮助,将不胜感激.

Answer 1

经典的ASP,ASP.NET,PHP或任何其他动态语言,它与你真正做的一样是FORM POST ing,那就是HTML,而不是ASP.

假设你有一个像这样的表格

<form id="frm-submit" action="/SendEmail.asp" action="POST">

   ...

   <input type="submit" value="Submit form" />
</form>

添加一个小jQuery到页面

$(function() {

   $("#frm-send").submit(function() {
      var data = $(this).serialize(),
          action = $(this).attr("action"),
          method = $(this).attr("method");

      $(".loading").show(); // show loading div
      $.ajax({
         url: action,
         type: method,
         data: data,
         success: function(data) {
             // all went well...
         },
         error: function(err) {
             // there was something not right...
         },
         complete: function() {
            $(".loading").hide(); // hide the loading
         }
      });

      return false; // don't let the form be submitted
   });

});

你准备好了.

在您的sendMail.asp页面中,您发送到的所有内容都Response.Write将在方法的data变量中success,因此在您发送电子邮件后,您将拥有:

Response.Write("done")
Responde.Flush()
Response.End()

在javascript部分,你可以像下面这样处理它:

success(data) {
    if(data === "done")
    {
       // Super duper! let's show the user a Thank you for submit page
       document.location = "/ThankYou.asp";
    }
}