Backbone.js display JSON in template using underscore

Question

I'm pretty new to BackboneJs and I'm trully lost there, an all day lost facing this maybe simple problem.

I try to create an app which runs offline. So i don't use any model or collection, and strange things like .save, .fetch. I only use Backbone for history, structure and templating system.

My question is. I have some JSON, how can I display it in my template ?

My View, all is working til there. My json is in the jsonVar.

window.ExposView = Backbone.View.extend({
    template:_.template($('#expos').html()),
    render:function (eventName) {
        console.log(jsonVar); // it's ok here
        $(this.el).html(this.template(),{"output":jsonVar});
        return this;
    }
});

My Template (using jQuery mobile at the same time), I want my Json to show there.

<script type="text/tempate" id="expos">
    <div data-role="header" class="header">
        <a href="#" data-icon="back" class="back ui-btn-left">Back</a>
    </div>
    <div data-role="content" class="content">
        <%= output %>
    </div>
</script>

Error : output is not defined.. Well

Another question. If by any miracle my template receive my json output, how can I display it using underscoreJs ?

Thanks for your time, have a nice weekend.

Uselessinfo · Accepted Answer · 2013-09-20 20:35:49Z

1

You are very close. You just need to call the template function with the object.

$(this.el).html(this.template({"output":jsonVar}));

answered Sep 20, 2013 at 20:35

Uselessinfo

562 bronze badges

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

1 Comment

user2686922 Over a year ago

I knew it was simple, but not THAT simple. Thx a lot !

McGarnagle · Accepted Answer · 2013-09-20 20:36:31Z

0

You've just got the syntax slightly off -- a compiled template is a function that you pass the JSON model to. Like this:

$(this.el).html(this.template({"output":jsonVar}));

There are a number of ways you can render, but I guess you want to just add the markup to the DOM. Try something like this:

var view = new ExposView();
$("body").append(view.render().el);

Fiddle

answered Sep 20, 2013 at 20:36

McGarnagle

103k31 gold badges235 silver badges264 bronze badges

Collectives™ on Stack Overflow

Backbone.js display JSON in template using underscore

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related