Home/ Questions/Q 7068533
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T05:20:08+00:00

I have a web app were the entire layout remains constant except for one

  • 0

I have a web app were the entire layout remains constant except for one <div>. Currently, I’m just using routes to handle links and it seems like quite a waste to reload the rest of the layout.ejs file where the only thing I wish to change is my <div>.

What would I have to change in my layout.ejs file? Here is my current file:

<!DOCTYPE html>
<html lan="en">
  <head>
    <title><%= title %></title>
    <link rel="stylesheet" href="/stylesheets/reset.css">
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
    <script src="/nowjs/now.js"></script>
    <script src="/javascripts/chat.js"></script>
  </head>
  <body>
    <div id="wrapper">
        <div id="header">
        </div>
        <div id="chat">
            <input type="text" id="text-input">
            <input type="button" value="Send" id="send-button">
        </div>
        <div id="content">
            <%- body %>
        </div>
        <div id="rooms">
        </div>
        <div id="footer">
            <div id="footer_links">
                <a href="/">Home</a> | <a href="/about">About</a> | <a href="/contact">Contact</a>
            </div>
        </div>
    </div>
  </body>
</html>

I was thinking about using AJAX to use this, but I’ve heard some good things about using partial views. I’m just not sure at all about how to set this up. Also, I’ve heard that it’s possible to use WebSockets with partial views instead of AJAX. Is this a good idea, or even possible?

Sorry this may be straightforward. I’m having a difficult time with the documentation.

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I just worked it out.


    You can call `partial(filename)` in the view to load the partial. say we use EJS, and there is three files in `views/`:

    1. layout.ejs
    2. index.ejs
    3. header.ejs

    and the content of index.ejs is :

    then, start the server, browser it, you will see `header.ejs` is loaded to `index.ejs`.

    !!!　UPDATE

    In the express version >=3.0, there is no partial() any more. But we can use <% include xxx.file %>, or just use another module: “express-partials”. Please search it on Github.

    • 0