title: KnockoutJS async
body: <p>Can anyone tell me the best way to do three seperate get requests from knockout to .net WebAPI to bind observable arrays in the following code?  Firebug shows the load times as a few ms but it is actually taking a few seconds.</p>
  
  <p>I was hoping to get some guidance before looking at any javascript async.</p>
  
  <pre><code>   $(function () { 
          var model = new viewModel();
          model.todayTimes([]); 
          model.zones([]);
          model.dayTypes([]);
  
          $.get('../api/Zone', function (data) {
          model.zones(data);
  
          });
  
           $.get('../api/DayType', function (data) {
          model.dayTypes(data);
  
          });
  
          $.get('../api/TemplateTime/?dayTypeId='+model.dayType(), function (data) { 
              model.todayTimes(data); 
              ko.applyBindings(model); 
          }); 
  </code></pre>
  
  <p>EDIT</p>
  
  <pre><code>function viewModel() {
          var self = this;
          self.dayType = ko.observable(1);
           self.todayTimes = ko.observableArray([]);
           self.dayTypes = ko.observableArray([]);
           self.zones = ko.observableArray([]);
  
  //other code
  
    $.getJSON("/api/Zone", function(data) {
      self.zones(data);
  
  
      $.getJSON("/api/DayType", function(data) {
      self.dayTypes(data);
      }); 
  
         $.getJSON('../api/TemplateTime/?dayTypeId=1', function (data) { 
              self.todayTimes(data); 
          }); 
  
  }
    $(function () { 
          ko.applyBindings(new viewModel());           
        });
  </code></pre>