How to HTTP Post / HTTP Get and navigate to another page using JQuery

Question

Hi Friends
I am working with a Full Calender application, in that,while i click in a event it must be redirect to another page and also post the data like event id,event start,event end,user id so on,how can i do that in J Query and Full Calender

Answer 1

When you wire up your fullcalendar you need to use the eventClick event.

$(your_calendar_selector).fullCalendar({
            eventClick: eventClick,
        });

Then you define a handler like:

function eventClick(event) {}

From in that function you can do something as simple as setting the window.location.href to another page, passing the values you need on the querystring, or do a POST to the new page serializing up the event data required.

Answer 2

I think you can do something like this :

$('#calendar').fullCalendar({
  eventClick: function(calEvent, jsEvent, view) {
    window.location = 'page.php?' 
                      + 'id=' + calEvent.id
                      + '&start=' + calEvent.start
                      + '&end=' + calEvent.end
                      + '&user_id=' + calEvent.user_id;
  }
});

FullCalendar click event

You can use this method to POST your data :

function post_to_url(path, params, method) {
  method = method || "post"; // Set method to post by default, if not specified.

  // The rest of this code assumes you are not using a library.
  // It can be made less wordy if you use one.
  var form = document.createElement("form");
  form.setAttribute("method", method);
  form.setAttribute("action", path);

  for(var key in params) {
    var hiddenField = document.createElement("input");
    hiddenField.setAttribute("type", "hidden");
    hiddenField.setAttribute("name", key);
    hiddenField.setAttribute("value", params[key]);

    form.appendChild(hiddenField);
  }

  document.body.appendChild(form);    // Not entirely sure if this is necessary
  form.submit();
}

Took it from here.

An example how to use it :

$('#calendar').fullCalendar({
  eventClick: function(calEvent, jsEvent, view) {
    var method = 'POST';
    var path = 'page.php';
    var params = new Array();
    params['event_id'] = calEvent.id;
    params['event_start'] = calEvent.start;
    params['event_end'] = calEvent.end;
    params['event_user_id'] = calEvent.user_id;
    post_to_url(path, params, method);
  ­}
­});