Store json object to html element with handlebars

Question

how to store the json complete object in html element as a data attribute

var a = {name : "sample",age : "34"}
$.find('#someDiv").data("adata",a);

can we achive the same thing with handlebars while creating the template

<div id="someDiv" data-adata="{{a}}"></div>

is that possible?

right now i have stringyfied the json and stored it according as specified in here stackoverflow.com/questions/10232574/… ,is there any direct approch with handlebars — gokul
– gokul, Commented Mar 18, 2014 at 10:01
If you want to store a reference to the actual object instead of the JSON string, try this similar question: stackoverflow.com/a/57313280/1075062 — Etherman
– Etherman, Commented Aug 1, 2019 at 16:25

Diosney · Accepted Answer · 2014-03-19 14:37:36Z

3

You can't embed JSON perse in the HTML, since HTML is pure string and JSON not.

But you do can stringify it and store it there with a custom method like the following:

/*
 * Simple helper to stringify an object.
 * Usage: {{ JSON2string object }}
 */
Handlebars.registerHelper('JSON2string', function (object:Object) {
    return JSON.stringify(object);
});

Then, in the templates, you can use it like:

<div id="someDiv" data-adata="{{JSON2string a}}"></div>

Which effectively store a JSON string in the data attribute.

answered Mar 19, 2014 at 14:37

Diosney

10.6k15 gold badges70 silver badges113 bronze badges

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

Collectives™ on Stack Overflow

Store json object to html element with handlebars

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related