title: knockout.js set focus in a template
body: <p>How can I use <code>knockout.js</code> to set focus on an element that was created by a template bound to an array?</p>
  
  <p>I have an observable array bound to a table, where each row is a set of input elements to allow the array element's properties to be edited. At the bottom is an <code>"Add"</code> button which pushes a new element into the array, creating a new row of input fields.</p>
  
  <p>What I'm trying to do is have the focus set to the first of the newly created input fields after the <code>"Add"</code> button has been pressed.</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script src="http://cdn.jsdelivr.net/knockout/3.0.0/knockout.debug.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;table data-bind='foreach: Attributes'&gt;
        &lt;tr&gt;
          &lt;td&gt;&lt;input type='text' data-bind='value: Name, disable: HardCoded/&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input type='text' data-bind='value: Description'/&gt;&lt;/td&gt;
          &lt;td&gt;&lt;button data-bind="click: $parent.removeAttribute"&gt;Delete&lt;/button&gt;&lt;/td&gt;
        &lt;/tr&gt;
      &lt;/table&gt;
      &lt;button data-bind="click: addAttribute"&gt;Add attribute&lt;/button&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>function Attribute(id, name, description, hardcoded) {
    var self=this;
    self.AttributeID=ko.observable(id || 0);
    self.Name=name || '';
    self.Description=description || '';
    self.HardCoded=hardcoded || false;
    self.nameFocus = true;
  }
  
  function AttributeSchema(attributeArray) {
    var self=this;
  
    // Properties
    self.Attributes=ko.observableArray(attributeArray);
  
    // Operations
    self.addAttribute=function() {
      self.Attributes.push(new Attribute());
    };
  
    self.removeAttribute=function() {
      self.Attributes.remove(this);
    };
  }
  
  var vmSchema=new AttributeSchema(
    [
      new Attribute(5, 'FirstName', 'First Name', true),
      new Attribute(6, 'LastName', 'Last Name', true),
      new Attribute(7, 'Blah', 'Blah', false)
    ]
  );
  
  ko.applyBindings(vmSchema);
  </code></pre>