CODEWITHSUNDEEP
javascriptnode.jsexpressswig-template
reagan
reagan

Reputation: 653

Can you render swigjs inside scripts?

I'm using nodejs + express + swigjs for a website of mine and got stuck. I have a <select> that contains <option>s populated by a variable passed to my template. Upon selection of an option I want to, inside of a <script>, find that selection and use it elsewhere on the page.

Can you do this with swig? I looked all over their documentation and haven't found a filter/option/tag that lets this happen. I would love to see an example. Thanks!

EDIT: Here's what I'm trying to do.

My controller renders the template with the following instruction:

res.render('pages/edit.html', {
    page: res.locals.page,
    content: results,
    media: media,
    directives: directives
});

In my template I want to do the following:

$('#addpiece').click(function(event){
    var jsoned = {{ media }};
    console.log(jsoned);
});

media is an array of objects.

But no matter how I filter the data it won't pass without a javascript error occurring.

Upvotes: 0

Views: 252

Answers (3)

kanibalv
kanibalv

Reputation: 599

I had the same problem and it was solved adding "safe" instead of "json".

    $('#addpiece').click(function(event){
    var jsoned = {{ media|safe }};
});

where the array is like: 

media = [ [ 'a1', 'b1', 'c1' ],  [ 'a3', 'b2', 'c2' ] ]

Upvotes: 0

Paul Armstrong
Paul Armstrong

Reputation: 7156

Use the json filter and you should be set!

$('#addpiece').click(function(event){
    var jsoned = {{ media|json }};
    console.log(jsoned);
});

Upvotes: 3

Mikhail
Mikhail

Reputation: 9007

{{ media }} needs to produce javascript-proper code. It can't be just an object. Try converting it server-side to JSON and then read it by your client-side javascript.

Upvotes: 0

Related Questions