首页 > 解决方案 > NodeJS-Express 联系表单模板在同一部分刷新

问题描述

我在提交联系表时遇到了一点问题。我在 NodeJS-Express 中使用 Nodemailer。

一切正常,除了我的联系表单位于模板的底部,并且在提交表单并使用 res.render(带有“已发送电子邮件”消息)后,模板从顶部重新加载,这对用户不是很友好。

知道如何使用 res.render 并留在模板的底部。

提前致谢

 <form method="POST" action="send">
      <label for="fname">First Name</label>
      <input type="text" id="fname" name="firstname" placeholder="Your name..">

      <label for="lname">Last Name</label>
      <input type="text" id="lname" name="lastname" placeholder="Your last name..">

      <label for="message">Message</label>
      <textarea id="message" name="message" placeholder="Write something.." style="height:200px"></textarea>

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

和 app.js

transporter.sendMail(mailOptions, (error, info) => {
        if (error) {
            return console.log(error);
        }
        var sentmsg ="email was sent";
        console.log('Message %s sent: %s', info.messageId, info.response);
        res.render("website3dartist", {sentmsg: sentmsg})
        });

标签: node.jsexpresscontact-formnodemailer

解决方案


基本上你不能在res.render没有重新渲染的情况下使用,因为res它本身意味着服务器会给你新的响应,这意味着闪烁。

您可以删除res.render并添加e.preventDefault()POST表单以防止页面重新加载。

由于 的唯一目的transporter.sendMail是记录消息,因此只需将其添加到它们。


推荐阅读