Reputation: 45
I'm searching for a way to use ajax running on node.js, express and jade as template-engine without routing to subpages. I read this: Node, Express, Ajax, and Jade Example
But this doesn't work for me. I don't want to make a route to a partial part of page, so the user could access the partial page. I just want to serve a convertet jade file in a part of the website.
I think about something like this:
$( ".trigger" ).on( "click", function() {
$( ".result" ).load( "ajax/test.jade" );
});
How could I do this without setting a route in node.js so the user could access the subpage without accessing the whole page.
Thank you for your answers.
Upvotes: 1
Views: 8344
Reputation: 5868
I have a problem with ajax call
Server side:
router.get('/user/letterlist', function(req, res) {
// ... some operations
res.render('userLetterList', { title: 'test', rows : rows? rows: null, pageCount: pageCount,itemCount: itemCount });
});
Client side index.jade
extends layout
block content
div(id="userLettersList")
button(type="button" class="btn btn-success")
{success}
script.
$(".btn").click(function(e){
e.preventDefault();
$.ajax({
url: "/user/letterlist",
success: function(data){
$("#userLettersList").html(data) ;
}
});
});
client side userLetterList.jade
table(id="UserLetters" class="table table-striped table-bordered")
thead
....
The problem is when push on the button to load data into the div, it will retrieve and show, but the page redirect to nowhere with a blank page, after some m-seconds.
Upvotes: 0
Reputation: 6309
You could place a jade template (or HTML file) in the public folder on your website, assuming you have it set up.
For example, in the app.js:
app.use(express.static(__dirname + '/public'));
Place the template/file in (or any subfolder):
/public/example.html
Then you can use $.get
to load the file, like the link you provided:
$.get('/example.html', function(result) {
$('#test').html(result);
});
Upvotes: 0
Reputation: 13549
What if you send the file as a GET parameter:
var jade = require('jade'),
fs = require('fs');
app.get('/ajax', function(req, res) {
fs.readFile(req.query.file, 'utf8', function (err, data) {
if (err) throw err;
var fn = jade.compile(data);
var html = fn({});
res.send(html);
});
});
and send request like
/ajax?file=test.jade
If you do the things like that you will have only one route.
Upvotes: 5