I have made a route which is called in a specific event(click event) through AJAX. My route is called but the page is not rendered with the call.
My AJAX function:
function showProfile(user_id) { console.log("show pro:" + user_id); $.ajax({ url: "/users/profile?id=" + user_id, type: "GET", success: function (data) { } });
}
My route:
router.get('/profile',middleware.ensureAuthenticated, function (req, res) { console.log(req.query.id); res.render('profile');
});
My code through which I am making the AJAX call
$.ajax({ type: "GET", url: "/users/friendSearch/" + q, success: function (data) { console.log("here"); //data = JSON.parse(data); var output = ""; data.forEach(function (t) { output += '<div class="card three wide column" ' + 'onclick=showProfile(' + t.oAuth_id + ')>' + '<div class="image">' + '<img src="/assets/matthew.png">' + '</div>' + '<div class="content">' + '<div class="header">' + t.firstName + " " + t.lastName + '</div>' + '</div>' + '<div class="extra content">' + '<div class="ui button" onclick=addFriend('+t.oAuth_id+') ' + 'id="follow">' + 'Follow' + '</div>' + '</div>' + '</div>' }); document.getElementById("user_placeholder").innerHTML = output; } });
I am dynamically creating the HTML code and have added an onclick method in the div
I am able to print the id which I am sending through the AJAX call but my EJS page is not loading Thanks
UPDATE: I am getting a 304 on response
Advertisement
Answer
I suppose this is a problem with invoking a res.render()
route via AJAX since it simply returns the HTML string (as you probably see in your Response Preview in your Developer Tools -> Network -> Response Preview), and not do anything else. So, I would suggest using something like this in concept:
function showProfile(user_id) { console.log("show pro:" + user_id); $.ajax({ url: "/users/profile?id=" + user_id, type: "GET", success: function (data) { document.getElementById("userprofile").innerHTML = data } }); }
…in order to render the HTML data that the /profile
route responded with, into
<div id="userprofile"></div>
Or, you can take a different approach by using res.json()
to return data instead and manually outputting it to the HTML.
Answer to similar problem to yours: Express.js res.render not redirecting, just displayed in console