How do I output Jade content through JSON? (Node.js)

Question

I wrote a video gallery web app a few months ago in CodeIgniter and I'm trying to move the back end to Node, using Express + Jade to produce the content. The PHP version sends JSON to the front end, often including a substantial chunk of HTML.

I'd like to render the HTML bit with Jade (as that's what it's there for), but obviously I want to output it in JSON format and not straight to the browser. It may be painfully obvious how to do this, but I just can't figure it out at the moment... Any help very much appreciated.

Original PHP

ob_start(); for ($i = $start; $i < $end; $i++) { $v = $videos[$i]; echo '<a id="video-' . $v->url . (isset($v->otherid) ? '-' . $v->otherid : '') . '" href="#!' . Settings::$pretty_link . '/' . $v->url . (isset($v->otherid) ? '/' . $v->otherid : '') . '" class="Box' . ($i == $start ? " Batch" : "") . '" title="Click to view the ' . $v->name . '"><img src="' . site_url('images/thumb/' . $v->image) . '" alt="The ' . $v->name . '" /><span>' . $v->name . '</span></a>'; } $data[$html] = ob_get_clean(); // Add some other things to $data echo json_encode($data);

Shiny new Jade

- var v - for (var i = view.start; i < view.end; i++) { - v = view.videos[i] a(id="#{v.url + (v.otherid === null ? "" : "-" + v.otherid)}", href="#!#{settings.prettyLink + "/" + v.url + (v.otherid === null ? "" : "/" + v.otherid)}/", class="Box #{i == view.start ? "Batch" : ""}", title="Click to view the #{v.name}" ) img(src="#{settings.siteUrl}images/thumb/#{v.image}", alt="The #{v.name}") span #{v.name} - }

How do I do the $data[$html] = ob_get_clean(); line? (And possibly also the json_encode one, though I currently have high hopes for JSON.stringify. :)

Edit As @loganfsmyth requested, the code used to render the Jade file (basically just the same as the Express examples).

res.render("search", { view: view, settings: vgSettings.app });

Can you show the code you are using to render the jade file? — loganfsmyth
– loganfsmyth, Commented Feb 24, 2012 at 2:50
@loganfsmyth Added it, though PuerkitoBio's answer below is what I'm trying to do. (Sorry for slow response - was bedtime.) — meloncholy
– meloncholy, Commented Feb 24, 2012 at 14:59

mna · Accepted Answer · 2012-02-24 03:08:47Z

5

Haven't tried it, though from the Express docs, this should work:

res.render('yourJadeView', { someOptionalLocal: 'someValue' }, function(err, string) { res.json({html: string}); });

answered Feb 24, 2012 at 3:08

mna

24.2k6 gold badges50 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

meloncholy Over a year ago

Whoo! Thanks! Yes, it works as described. I somehow missed the callback fn option in the documentation, but this is exactly what I want to do.

Alen Siljak · Accepted Answer · 2012-09-06 10:24:34Z

In case you'd want to output only JSON, this should do the job:

 res.json({ yourValue: 'hi there' });

A status code can be added:

 res.json(obj, status)

For example:

 res.json( { workouts: docs }, 200);

Or, places can be swapped, as in:

 res.json(status, obj);

With res.json there is no need to specify headers or call .end(). It will do everything by default.

Thanks for the reply. As I tried to explain above, I was attempting to output some HTML that I'd generated via Jade as part of a JSON object. @PuerkitoBio's answer showed me how to do that.

Collectives™ on Stack Overflow

How do I output Jade content through JSON? (Node.js)

2 Answers 2

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Related