title: Passing $index and $data as arguments to function for click handler
body: <p>I am passing <code>$index</code> and <code>$data</code> to the <code>change_model</code> function. The function is expecting 2 parameters in the following order: <code>(index, data)</code>. </p>
  
  <p>From the viewModel I am passing <code>click: $root.change_model.bind($data, $index())</code>. Within the function <code>index</code> prints <code>$data</code>, and <code>data</code> prints <code>index</code>: values are reversed.</p>
  
  <pre><code>self.change_model = function(index, data) {
    self.patternSelectedIndex(index);
    selected_door = data.file;
    create_door();
  };
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div data-bind="foreach: x.patterns"&gt;
      &lt;div class="thumbnail" data-bind="css: { selected: $index() === $root.patternSelectedIndex() }"&gt;
        &lt;img class='img model' style='width:164px;height:90px;padding:5px' data-bind="attr:{src:'images/models/' + $data.file + '.png'}, click: $root.change_model.bind($data, $index())" /&gt;
        &lt;div class="caption"&gt;
          &lt;span data-bind="text: $data.name"&gt;&lt;/span&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>