Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>If I am understanding you correctly, the way you have this setup now, you will not be able to trigger </p> <pre><code> events: { 'click button#addQuestion': 'addQuestion' } </code></pre> <p>because the input tag needs to be in the backbone template. So to fix this problem, the black bone template will render the button on the page, then listen for the click on the button. When the button is clicked, you will load the question template (which is embedded in the html page and insert that into the current backbone template. </p> <pre><code>&lt;script id="viewTemplate" type="text/template"&gt; &lt;div id="stemView"&gt;{{ Stem }}&lt;/div&gt; &lt;label for="answer1"&gt; a)&lt;/label&gt;&lt;div&gt;{{ answer1View }}&lt;/div&gt; &lt;label for="answer2"&gt; b)&lt;/label&gt;&lt;div&gt;{{ answer2View }}&lt;/div&gt; &lt;label for="answer3"&gt; c)&lt;/label&gt;&lt;div&gt;{{ answer3View }}&lt;/div&gt; &lt;label for="answer4"&gt; d)&lt;/label&gt;&lt;div&gt;{{ answer4View }}&lt;/div&gt; &lt;/script&gt; &lt;script id="mainTemplate" type="text/template"&gt; &lt;input type="button" id="addQuestion" value="Add Question" /&gt; &lt;/script&gt; wizard.PlayView = Backbone.View.extend({ initialize: function () { this.model.bind('change', _.bind(this.render, this)); }, el: '#playView', template : _.template($('#mainTemplate').html()) events: { 'click button#addQuestion': 'addQuestion' } addQuestion: function () { var t = _.template($('#stemTemplate').html(); $(this.el).append(t(this.model.toJSON())); } render: function() { $(this.el).append(this.template(this.model.toJSON())); } }); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload