title: Knockout.js onclick button how to focus and clear the input field text
body: <p>I have button and input field, on clicking the button i want to focus the input field also want to clear the field value. any idea ?</p>
  
  <p>please note below my  html js</p>
  
  <pre><code>HTML:
          &lt;div class="inputStyle03"&gt;
                          &lt;input type="text" data-bind="value: myParentViewModel.newCustomViewSubTab, hasFocus: true" id="inputCustomViewName" placeholder="Enter a name for your customer view" /&gt;
                      &lt;/div&gt;
        &lt;div class="buttonStyle02 buttonStyle03Ext01 columnRight" data-bind="click: myParentViewModel.addNewCustomView"&gt;
                  &lt;a&gt;Add New Custom View&lt;/a&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>function ParentViewModel()
  {
      var that = this;
      that.myViewModelRibbon = new TabViewModel();
      that.newCustomViewSubTab = ko.observable(); //  newly adding custom view from input field
  
      that.addNewCustomView = function (data, event) {
          var allSubTAbs = data.myViewModelRibbon.ActiveSubTabs();
          var userDefinedCustomView = {
              "SubTabName": that.newCustomViewSubTab(), // getting the SubTabName from the input observables text box
              "IconPath": "images/icons/Document.png",
              "GroupID": "0",
              "IsMultipleActive": "0",
              "EnabledState": "enabled",
              "CallbackOnSelect": "openCommonForm"
          };
          if (!!that.newCustomViewSubTab()) {
              //if (that.newCustomViewSubTab() != null &amp;&amp; that.newCustomViewSubTab() !== '') {
              data.myViewModelRibbon.ActiveSubTabs.push(userDefinedCustomView);
  
          } else {
              alert("Please enter - Define a new custom view field");
          };
      }
      return that;
  }
  
  var myParentViewModel = new ParentViewModel();
  ko.applyBindings(myParentViewModel);
  </code></pre>