模态弹出并带有EJS和Express

发布于 2025-01-21 17:54:44 字数 2155 浏览 0 评论 0原文

因此,首先,我是后端的新手,也许有些困惑,我有一个项目,所以我的困惑是如何连接它:

modal.ejs

<div class="modal fade text-black" id="Modal" tabindex="-1" aria-labelledby="ModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content position-relative">
            <div class="modal-body">
                <button type="button"
                    class="btn-close position-absolute top-50 end-0 translate-middle btn-danger rounded-circle"
                    data-bs-dismiss="modal" aria-label="Close"></button>
                <% if(true) { %>
                    data accepted
                <% }else{ %>
                    data rejected
                <% } %>
            </div>
        </div>
    </div>
</div>

index.html零件表格

<form class="col-lg-4 col-lg-offset-4 form-inline justify-content-center" action="/" method="post">
            <input class="form-control mt-2" id="input" type="text" placeholder="Name of company" name="companyName">
            <input class="form-control mt-3" id="input" type="search" placeholder="https://www.company.com/" name="website">    
            <button type="submit" id="button" class="btn btn-primary mt-4 px-4" data-bs-toggle="modal" data-bs-target="#Modal">Check</button>
        </form>
    </div>

有效了,但是弹出窗口没有出现,而是出现了一个新页面

app.js

app.post("/", function (req, res) {
  const url = {
    name: req.body.companyName,
    link: req.body.website,
  };

  Url.findOne({ website: url.link }, function (err, foundCompany) {
    if (foundCompany) {
      console.log("found in db");
      // res.redirect("/accepted");
      res.render("modal");
    } else {
      const newUrl = new Url({
        name: url.name,
        website: url.link,
      });

      newUrl.save();

      console.log("not found in db");
      // res.redirect("/notaccepted");
    }
  });
});

如何使服务器显示数据库的检查结果?
如果找到数据=&gt;找到的数据
else =&gt;找不到数据

So first I'm new to backend and maybe a little confused and I have a project so my confusion is how to connect this:

modal.ejs

<div class="modal fade text-black" id="Modal" tabindex="-1" aria-labelledby="ModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content position-relative">
            <div class="modal-body">
                <button type="button"
                    class="btn-close position-absolute top-50 end-0 translate-middle btn-danger rounded-circle"
                    data-bs-dismiss="modal" aria-label="Close"></button>
                <% if(true) { %>
                    data accepted
                <% }else{ %>
                    data rejected
                <% } %>
            </div>
        </div>
    </div>
</div>

index.html part form

<form class="col-lg-4 col-lg-offset-4 form-inline justify-content-center" action="/" method="post">
            <input class="form-control mt-2" id="input" type="text" placeholder="Name of company" name="companyName">
            <input class="form-control mt-3" id="input" type="search" placeholder="https://www.company.com/" name="website">    
            <button type="submit" id="button" class="btn btn-primary mt-4 px-4" data-bs-toggle="modal" data-bs-target="#Modal">Check</button>
        </form>
    </div>

This has worked, but the pop up doesn't appear, instead a new page appears

app.js

app.post("/", function (req, res) {
  const url = {
    name: req.body.companyName,
    link: req.body.website,
  };

  Url.findOne({ website: url.link }, function (err, foundCompany) {
    if (foundCompany) {
      console.log("found in db");
      // res.redirect("/accepted");
      res.render("modal");
    } else {
      const newUrl = new Url({
        name: url.name,
        website: url.link,
      });

      newUrl.save();

      console.log("not found in db");
      // res.redirect("/notaccepted");
    }
  });
});

How to make the server to show a modal pop up as a result from a check on the database?
if found data => data found
else => data not found

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文