how to indent a div in the index.jade with node.js expressjs?

Question

how to indent a div in the index.jade with node.js expressjs?

i have an index.jade that have a div with nothing this div called div_one it supose to be dynamic div so i change the content with a button so i have 4 divs prepared in .jade to replace de content of div_one

i want to put some divs on that div when i push a button

#div_one
    //nothing

when i push the button the div_one change

#div_one
    #div_in_1
        t some text
    #div_in_2
        t other text data

thank you!

node.js
html
express
jade

Answer 1

I'm not sure what this has to do with indenting, but something like this works (I use jQuery here)...

script
    $('#btn').click(function() {
        $('#div_one').html('<div id="div_in_1">t some text</div><div id="div_in_2">t other text data</div>');
    });

#div_one
    | empty

button#btn Click me

Answer 2

I think that you may want to use separate requests for this, i.e. AJAX. The server side code would be:

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

// For every div

The front-end code would be:

$('#btn1').on('click', function() {
    $.ajax({
        url: "/div_in_1",
    }).done(function(msg) { 
        $('#div_one').html(msg);
    });
}