Include Backbone template html synchronously

Question

I am trying to find a way to put my Backbone templates in a different HTML file than the main file sent from the server in a HTTP request. That way, I can more easily see the layout skeleton of a page, without have to sift through all the Backbone templates that would otherwise clutter the HTML code.

One solution I saw does this:

  <head>
    <script>
        $(function(){
            $("#includedContent").load("/LoginViewPartials.html");
        });
    </script>
 </head>

however, this doesn't seem to work probably because (1) this is loading the other html file asynchronously instead of synchronously and (2) perhaps the entire methodology of including my templates in a second HTML file is altogether flawed.

is there a best practice as to putting your Backbone templates in a separate HTML file? JST templates allow you to put your templates in a JavaScript file, is that the best solution?

score 0 · Answer 1 · answered Mar 15 '15 at 12:27

you can use jQuery’s Deferred / Promise features.

 $.when(something).then(doSomething);

     var that = this;

     var templateRetrieved = this.getTemplate();

     $.when(templateRetrieved).then(function(template){
       var html = that.renderTemplate(template, data);
       that.$el.html(html);
     });

Include Backbone template html synchronously

1 Answers1