user3187759 user3187759 - 2 months ago 16
jQuery Question

jquery .load() page with express js

I have a node.js file that send data to my index.ejs file as so:

app.get('/', function (req, res) { //send the varibles to html file
res.render('index', {
title: 'Personal info',
data: arr
});
});


I want the index file to have an html page (page.ejs) loaded into it using jquery .load() function. But here's the issue. The loaded page needs to display the info, but if i'll redirect the data to it (
res.render('page',
) the browser will just show me the page.ejs file. How can I have localhost:3000 load the index, have the index load page.ejs and have page.ejs display the data?

Answer

As far as I understand you try to request the page.ejs, a partial template file via AJAX (using jQuery) or you want to include it just somehow.

Option 1: You can either include the Partial file via <%- include page.ejs %> in your index.ejs which will include your page.ejs from the beginning. Meaning it will be inserted on server side and the data of both files will be sent to the client as one file.

Option 2: Or you create another route controller in which you offer the page.ejs content as HTML or JSON. So that the client would receive the content of the index.ejs first and would request the content of the page.ejs asynchronous.

Somehow like that:

Server side:

app.get('/page', function (req, res) { 
    res.render('page');
});

Client side:

$('#result').load('/page');