title: Preselect value in a Dropdown(select) KnockoutJS
body: <p>I am trying to preselect a value in a Dropdown. I am using KnockoutJS and calling a webservice to push values into my list. However, I am unable to preselect the value I want. Your help is much appreciated. I also did notice that an alert placed in ko.utils.arrayFirst is not being displayed. Thanks!</p>
  
  <pre><code>&lt;body&gt;
  &lt;form id="form1" runat="server"&gt;
  &lt;asp:ScriptManager ID="ScriptManager1" runat="server"&gt;
      &lt;Services&gt;
          &lt;asp:ServiceReference Path="~/platform/vendors.asmx" /&gt;
          &lt;asp:ServiceReference Path="~/platform/checkBooks.asmx" /&gt;
      &lt;/Services&gt;
  &lt;/asp:ScriptManager&gt;
  &lt;/form&gt;
  &lt;div&gt;
      &lt;p&gt;
          Checkbooks:
          &lt;select data-bind="options: cb, value: choice, optionsText: 'name'"&gt;&lt;/select&gt;
  
      &lt;/p&gt;
  &lt;/div&gt;
  
  &lt;script type="text/javascript"&gt;
      function errorHandler(errorObject) {
          var errType = errorObject._exceptionType;
          var errMsg = errorObject._message;
          window.alert("ERROR" + errType + ":" + errMsg);
          return false;
      }
  
      ko.observableArray.fn.find = function (prop, data) {
          var valueToMatch = data[prop];
          return ko.utils.arrayFirst(this(), function (item) {
              return (item[prop] === valueToMatch);
          });
      };
  
      function viewModel() {
          var self = this;
          self.cb = new ko.observableArray([]);
  
          self.call = function () {
              try {
                  checkBooks.list("accounting", 2, "name:", self.retCheckBooks, errorHandler);
              }
              catch (ex) {
                  alert(ex.message);
              }
          }
          self.retCheckBooks = function (results) {
              for (var i = 1; i &lt;= results.length; i++) {
                  self.cb.push({ id: i, name: results[i].shortName });
              }
          }
          var choice = { id: 4, name: "VCSTPAY" };
          self.choice = ko.observable(self.cb.find("id", choice));
      }
  &lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          vm = new viewModel();
          vm.call();
          ko.applyBindings(vm);
      });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>
  </p>