CODEWITHSUNDEEP
djangobackbone.jshandlebars.js
MatthewKremer
MatthewKremer

Reputation: 1569

Handlebars.JS is not replacing tags with context

I'm having quite the problem with Handlebars.JS as it is not replacing {{anything}} with the corresponding variables.

I have the following helper function:

function compileTemplate(name){
return Handlebars.compile($('#'+name+'-template').html());
}

Which I use in the following Backbone view:

Soccer.Teams.Li = compileTemplate('team-li');

    Soccer.Router = Backbone.Router.extend({
        routes: {
            "": "index"
        },
        index: function(){
            Soccer.container.html(compileTemplate('main'));
            var teams = new Soccer.Teams.View();
            var container = Soccer.container.find('.sub-content');
            container.html(teams.render().$el.html());
            var teamsList = container.find('#teams-list');
            teams.teams.forEach(function(team){
                teamsList.append(Soccer.Teams.Li(team.toJSON()));
            }, this);
            Soccer.page.trigger('pagecreate');
        }
    });

And #team-li-template is the following:

<script id="team-li-template" type="text/x-handlebars-template">
        <li team-id="{{id}}"><a>{{name}}</a></li>
    </script>

The correct information is definitely being passed, if I console.log the .toJSON it does contain the correct information, but nothing is replaced, the tags are just turned into nothing.

Any ideas?

Thanks!

Update:

Strangely enough I copied all of my code to a JSFiddle and it worked fine:

http://jsfiddle.net/vcrhh/1/

The actual app is 54.235.201.41 (sorry, wouldn't let me add it as a link).

Also tried just saving the code as a file locally and running it, that works fine too.

User username: [email protected] and password test for both. See anything wrong with the actual app? Why would it work in JSFiddle/local and not in my app?

Upvotes: 0

Views: 400

Answers (1)

mu is too short
mu is too short

Reputation: 434805

The Handlebars and Backbone looks fine and the fiddle runs so the problem is with your testing environment. When I look at the page source on your server, I see this:

<script id="team-li-template" type="text/x-handlebars-template">
    <li team-id=""><a></a></li>
</script>

Note the conspicuous absence of braces. I'd guess that something server-side is eating your braces. You say that you're using Django so Django's templates are probably causing your problem.

Upvotes: 1

Related Questions