【问题标题】:Express form handling without redirect. Has data without preventDefault, but redirects. Doesn't redirect with preventDefault, but doesn't have data无需重定向的快速表单处理。有没有 preventDefault 的数据,但会重定向。不使用 preventDefault 重定向,但没有数据
【发布时间】:2016-11-16 07:40:35
【问题描述】:

在第 22 分钟被卡住了。我正在使用自定义表单提交来避免在发布表单时遇到快速路由时重定向,但是,当不重定向时,我会丢失正在发送的数据。

document.getElementById('playerSearchForm').onsubmit = function(_event)
{
    _event.preventDefault();

    var XHR = new XMLHttpRequest();
    XHR.addEventListener('load', function(event)
    {
        var res = JSON.parse(event.currentTarget.response);
    });

    XHR.addEventListener('error', function(event)
    {
        // error handling
    });

    XHR.open('POST', '/createGame');

    var formData = new FormData();
    formData.append('username', document.getElementById("usernameInput").value);

    XHR.send(formData);
}

以上是我提交表单的方式。如果我在那里有_event.preventDefault(),那么我的页面不会重定向,这是预期的结果。然而,_event.preventDefault 也停止了在我的快速路线中req.body 上可用的用户名。如果我取出_event.preventDefault(),那么我可以访问req.body 中的用户名,但是页面会重定向。是否有另一种发送数据的方法而不是使用FormData,或者我可以调用 preventDefault 中的某些东西来确保数据可用?

【问题讨论】:

    标签: javascript html express xmlhttprequest


    【解决方案1】:

    好的,我找到了解决方案。

    我的部分问题是简单地从开头删除 _event.preventDefault() 意味着表单提交发生了两次。

    另一个问题是 FormData 以不可字符串化的方式发送 (MDN Source)。我没有深入研究文档,但我假设我使用的默认正文解析无法处理 FormData。为了解决这个问题,我完全删除了 formData,我只是发送 XHR 请求,如下所示:

    XHR.send('username='+document.getElementById("usernameInput").value);
    

    我不确定这是否是正确的做法,但它确实有效。

    【讨论】:

      猜你喜欢
      • 2021-07-28
      • 1970-01-01
      • 2012-01-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-05-21
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多