title: Knockout.js Binding to dropdownlist
body: <p>Trying to bind data to a dropdown list,</p>
  
  <pre><code>    function EmailTemplate(data) {
          var self = this;
          self.etId = ko.observable(data.email_template_id);
          self.etTypeId = ko.observable(data.email_template_type_id);
          self.etTitle = ko.observable(data.email_template_title);
          self.etContent = ko.observable(data.email_template_content);
          self.etAppYear = ko.observable(data.app_year);
          self.etSubject = ko.observable(data.subject);
          self.etActive = ko.observable(data.active);
      }
  
      function EmailTemplateViewModel() {
          var self = this;
          self.ETList = ko.observableArray();
  
          var uri = '/admin/services/EmailTemplateService.svc/EmailTemplates';
          OData.read(uri, function (data, response) {
              $.each(data.results, function (index, item) {
                  self.ETList.push(new EmailTemplate(item));
              });
          });
      }
      $(document).ready(function () {
          ko.applyBindings(new EmailTemplateViewModel());            
      });
  </code></pre>
  
  <p>HTML markup:</p>
  
  <pre><code> &lt;select data-bind="options: ETList, value:etId, optionsText: 'etTitle' "class="dropdown"&gt;&lt;/select&gt;
  </code></pre>
  
  <p>When I run this I got:
  Uncaught Error: Unable to parse bindings.
  Message: ReferenceError: etIdis not defined;
  Bindings value: options: ETList, value:etId, optionsText: 'etTitle'  </p>
  
  <p>When we bind to drop down list, how should we bind the value? and after binding, how should we capture or create dropdown change event in Knockout? </p>