【问题标题】:How to post form submission to a URL and redirect on submission to a different URL如何将表单提交发布到 URL 并在提交时重定向到不同的 URL
【发布时间】:2019-04-22 08:32:21
【问题描述】:

我想将表单字段发布到 1 个 url 并重定向到不同的 url。我有发布到我想要的 url 的代码,但我如何重定向到另一个? URL 我想将提交的内容发布到:www.mywebsite.com/submissions 我想在提交时将用户重定向到的 URL:www.anotherwebsite.com/confirmation

这是我目前所拥有的:

<form action="https://mywebsite.com/submissions" 
method="post">

    First name: <input type="text" name="fname"><br>
    Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">

</form>

【问题讨论】:

  • 您好,可以提供https://mywebsite.com/submissions中的脚本吗?您目前如何处理 POST?
  • 如果您的发帖请求成功,您可以使用window.location.href = 'http://redirecturl/';,甚至可以使用window.location.replace( 'http://redirecturl/')
  • 您需要 1) 通过 ajax 提交表单,防止提交事件传播 2) 等待成功回调 3) 在您的 ajax 回调中手动触发重定向
  • 帖子只是将条目记录在数据库中。所以这发生在后端,但我希望用户被重定向到更友好的确认屏幕。 @kkesley

标签: javascript html zapier


【解决方案1】:

有两种方法可以做到这一点:

  1. 使用Ajax提交表单,成功后从Javascript重定向
  2. 正常提交表单,并从服务器发送重定向响应,带有新的url

(2) 取决于您的服务器端语言 - PHP 或 Java。

您的后端语言或库中将提供某种重定向功能。它将发送带有备用 URL 的 HTTP 301 响应。浏览器将自动加载提供的新 URL。

编辑:

对于 (1),您可以处理按钮单击、防止默认行为以及通过 Ajax 手动发布表单。完成后,重定向页面。

// this is the id of the form
$("#FormID").submit(function(e) {
    e.preventDefault(); // avoid to execute the actual submit of the form.
    var form = $(this);
    var url = form.attr('action');
    $.ajax({
           type: "POST",
           url: url,
           data: form.serialize(), // serializes the form's elements.
           success: function(data)
           {
               alert(data); // show response 
               window.location.href = "www.anotherwebsite.com/confirmation";
           }
         }); 
    });

改编自这个 SO 答案:https://stackoverflow.com/a/6960586/1364747

【讨论】:

  • 我在 action="mywebsite.com/submissions" 中发布的 url 是一个 Zapier Webhook 用作触发器,所以我不确定哪种方法最好。
  • 您可能希望在您的问题中包含 Zapier 和 Webook 标签。这样你可能会得到更具体的答案..
  • 在 Zapier 的情况下,方法 1 应该可以正常工作。方法2需要服务器重定向。
【解决方案2】:

提交表单会将您重定向到目标网址。如果您想重定向到另一个位置,您可以使用 ajax 请求发布表单。这不会将您重定向到任何地方。然后,当您收到来自 ajax 的响应时,您可以重定向到您想要的 url。

【讨论】:

  • 我在 action="mywebsite.com/submissions" 中发布的 url 是一个 Zapier Webhook 用作触发器,所以我不确定哪种方法最好。
猜你喜欢
  • 2014-08-22
  • 1970-01-01
  • 2022-11-12
  • 1970-01-01
  • 1970-01-01
  • 2021-10-29
  • 1970-01-01
  • 2013-02-09
  • 1970-01-01
相关资源
最近更新 更多