title: knockout js push different values to the same observable array
body: <p>I am just learning more about knockout js, i am having a problem that when i push a table row to a template and then update the text field it updates all the inputs to the same value</p>
  
  <p>ViewModel:</p>
  
  <pre><code>function viewModel() {
      var root = this;
      root.loop = ko.observableArray([]);
      root.table = ko.observableArray([]);
      root.value = ko.observable('');
      root.push = function() {
          root.loop.push('');
      }      
  };
  </code></pre>
  
  <p>Html:</p>
  
  <pre><code>&lt;input type="button" data-bind="click: $root.push, value: 'New Row'"&gt;
  &lt;table&gt;
      &lt;tbody data-bind="template: { name: 'table',foreach: loop }"&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  
  &lt;script type="text/html" id="table"&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="text" data-bind="value: $root.value"&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input type="button" data-bind="click: $root.save, value: 'Save'"&gt;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>and here is a working example
  <a href="http://html5imageeditor.co.uk/kopush" rel="nofollow">http://html5imageeditor.co.uk/kopush</a>
  if you click on new row and add content then you will see what i mean</p>