title: Updating events in client side with Javascript
body: <p>I would like to know if there is anyway to update a Fullcalendar event in Javascript without having to reload the page, just by clicking a link with role button. When I click on the link 'Save' the event is updated in the server side but not in the client side, and I need the event to be updated in both sides. </p>
  
  <p>What I'm trying to do is edit the events of a Fullcalendar opening a modal form through eventClick. </p>
  
  <p>This is the code of my javascript</p>
  
  <pre><code>function drawControl(controls) {
  
          $('#calendar').fullCalendar({
              editable: true,
              aspectRatio: 1,
              contentHeight: 500,
              scrollTime: '24:00:00',
              minTime: '01:00:00',
              maxTime: '24:00:00',
              defaultView: 'agendaWeek',
              header:{left:"prev,next,today",
              center:"title",
              right:"month, agendaWeek, agendaDay"},
  
  
              events: allControls(controls), 
  
              eventRender: function(event, element) {
  
                  var bloodLevel=event.title
  
                  if(bloodLevel &gt;= 180) {
                      element.css('background-color', 'red');
                  }
                  else if(bloodLevel &lt; 70) {
                      element.css('background-color', 'yellow');
                  }
              },
              eventClick: function(calEvent, jsEvent, view) {
                      x=calEvent.id;
                  $('#modalTitle').html(calEvent.title);
                  $('#control_day_edit').val(moment(calEvent.start._i).format("DD-MM-YYYY hh:mm A/PM"));
                  $('#control_level').val(calEvent.title.toString());
                      console.log(calEvent)
                      console.log(calEvent.title)
                      console.log(calEvent.start._i)
                      console.log(calEvent.id)
                  $('#eventUrl').attr('href',"/users/:user_id/controls/calEvent.id/edit");
                  $('#fullCalModal').modal();
                  y=calEvent;
  
              }
  })
  }
  </code></pre>
  
  <p>});</p>
  
  <pre><code>document.getElementById('button_edit').addEventListener("click", editControl);
  
   function editControl(event) {
       event.preventDefault();
       console.log(y);
       console.log(x);
       var controlEdited = {
           "level": document.getElementById('control_level').value,
           "day": document.getElementById('control_day_edit').value,
           "period": document.getElementById('control_period').value,
           "id": x
      }
      $.post("/editControls", JSON.stringify(controlEdited));
      y.title = document.getElementById('control_level').value;
      y.start = moment(document.getElementById('control_day_edit').value);
      console.log(y.start);
      console.log(y);
      $('#calendar').fullCalendar('updateEvent', y);
  };
  </code></pre>