muneebShabbir
muneebShabbir

Reputation: 2528

Debug javascript template

i want to ask is there any way to debug the code written in JavaScript templates? i am using underscore.js for templates along with backbone.js.

other JavaScript code can be debugged through firebug/chrome . but i don't know how to debug a template. is it possible?

EDIT

var t ='        <div class="row-fluid">'                                                                                                          '
        +'          <div class="span12">'                                                                                                           '
        +'            <div class="span2 nowrap">'                                                                                                   '
        +'              <input class="" type="checkbox"/><%=Time%>'                                                                       '
        +'            </div>'                                                                                                                       '                                                                                                                     '
        +'        </div>'                                                                                                                          '



    TableRow = Backbone.View.extend({
        tagName: 'div',
        template:_.template(t),
        className: "",

        initialize: function (options) 
        {

        },

        render: function() 
        {
            this.$el.html( this.template(this.model.toJSON()) );
            return this;
        }
    });

Upvotes: 0

Views: 1459

Answers (2)

Dhruva Ray
Dhruva Ray

Reputation: 51

In Backbone Eye (Firebug extension), you can debug underscore templates - just as if they were regular JavaScript files. The template id (if specified) comes up in the script window (of Firefox) and you can select it (just like a regular script file), put breakpoints and watch the template being incrementally built. More details on how to do this is at http://dhruvaray.github.io/spa-eye/#views

Upvotes: 1

Amit Sharma
Amit Sharma

Reputation: 1210

muneeb, I always used firebug. first you will need to install the plugin after installing u will see the greyed out BUG icon towards topright section of firefox. you can start debugging by pressing on that icon or by pressing F12 key. There you will see tabs like Console,HTML,CSS,Script,DOM,net,cookies.

selecting script will ask you to reload the page again so that firebug can capture the java script written. add breakpoints and start debugging.:)

Upvotes: 0

Related Questions