CODEWITHSUNDEEP
javascripthtmlnode.jsejs
KAK4SHI HATAK3
KAK4SHI HATAK3

Reputation: 117

How to make an modal with ejs and node

I'm trying to learn a bit of ejs and node, I know that I can easily create a pop-up modal with only JS and HTML like this calling a function when I click certain button

Button to call the function:

<button id="myBtn">Open Modal</button>

Function:

btn.onclick = function() {
   modal.style.display = "block";
}

But how can I do this with Ejs and NodeJs?

Upvotes: 1

Views: 7549

Answers (1)

Quentin
Quentin

Reputation: 944498

It doesn't make sense to do this with EJS and Node. In this context those are tools for running server-side code. It makes more sense to use the existing JS you have as client-side JavaScript (in the HTML document you are generating from the EJS).

That said, if you really wanted to do it server-side, then you'd want something like this in the HTML:

<form method="post">
    <button name="modal" value="open">Open Modal</button>
</form>

And then (assuming you are using Express JS) something like:

const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded());
app.post("/your/page", function (req, res) {
    const show_modal = !!req.body.modal; // Cast to boolean
    res.render("page", { show_modal });
}

And then in the EJS:

<% if (show_modal) { %>
    <div id="modal" style="display: block">
        etc
    </div>
<% } %>

Upvotes: 6

Related Questions