title: add object to observable array using knockout
body: <p>For some reason i'm having trouble passing an object to observable array.</p>
  
  <pre><code>function CalendarViewModel() {
  var self = this;
  
  self.event = {
      name : ko.observable(""),
      adress : ko.observable(""),
      startTime : ko.observable(""),
      endTime : ko.observable("")
  }
  
  self.events = ko.observableArray([
  
  ])
  
  self.addEvent = function (event) {
  
      self.events.push(event);
  
      alert(self.events.length)
      alert(self.events[0].name());
   }
  </code></pre>
  
  <p>my view: </p>
  
  <pre><code> &lt;fieldset class="add-event-fieldset"&gt;
              &lt;div data-bind="with: event"&gt;
                  &lt;legend&gt;Add Event&lt;/legend&gt;
                  &lt;div style="text-align: center;"&gt;
                      &lt;label class="title-label"&gt;What &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label&gt;Name: &lt;/label&gt;
                      &lt;input type="text" name="whatTxtBox" data-bind="value: name" /&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label&gt;Where: &lt;/label&gt;
                      &lt;input type="text" name="whereTxtBox" data-bind="value: adress" /&gt;
                  &lt;/div&gt;
                  &lt;div style="text-align: center;"&gt;
                      &lt;label class="title-label"&gt;When &lt;/label&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label&gt;start: &lt;/label&gt;
                      &lt;input type="text" id="startHourTxtBox" data-bind="value: startTime" /&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label&gt;end: &lt;/label&gt;
                      &lt;input type="text" id="endHourTxtBox" data-bind="value: endTime" /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  
              &lt;input type="hidden" name="" id="hiddenDay" /&gt;
  
              &lt;button id="btnAddNewEvent" data-bind="click: $root.addEvent"&gt;+&lt;/button&gt;
          &lt;/fieldset&gt;
  </code></pre>
  
  <p>The alerts show that the array is always empty, please explain what i'm doing wrong thanks.</p>