Question

I am trying to display my events from a MySQL database. I’m using the events function. My XML file being returned is pretty basic. I’ve looked at all of the FullCalendar questions and most of them talk about JSON and point to the documentation for JSON. I can’t use JSON. I have to go XML. Can you tell me where I’m off.

Here is a sample of what my xml looks like:

<id><id>
<title>Grow Your Business on the Web</title> <br>
<start>2010-06-05T9:30</start>  <br>
<end>2010-06-05T12:30</end>  <br>
<className>O</className>  <br>
<url></url> 

The whole file is prefaced with a <event> tag and closed with a </event> tag.

My jquery is as follows:

$(document).ready(function() {

  $('#calendar').fullCalendar({
    height: 550,
    theme: true,
    header: {
            left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
        },
    editable: true,
    events: function(start, end, callback) {

    $.ajax({
        url: 'ncludeFiles/sbdp-cal-xml.php',
        dataType: 'xml',
        data: {
        // our hypothetical feed requires UNIX timestamps
        start: Math.round(start.getTime() / 1000),
        end: Math.round(end.getTime() / 1000)
        },
        success: function(doc) {

        var events = [];

            $(doc).find('event').each(function() {
                events.push({ 
                    title: $(this).attr('title'),
                    start: $(this).attr('start'),
                    end: $(this).attr('end'),
                    className: $(this).attr('className'),
                    url: $(this).attr('url')
                });
            });

            callback(events);
        }
    });
      }
  });
});

I’d appreciate any help you could give me. Thanks!

Answer 1

The sample code did not work for me either. Try this instead:

$.ajax({
 url: 'pathto/myxmlfeed.php',
 data: "start="+Math.round(start.getTime() / 1000)+"&end="+Math.round(end.getTime() / 1000)+"&_rand="+Math.floor(Math.random()*100),
 success: function(doc) {
  var events = [];
  $(doc).find('event').each(function() {
       events.push({
        title: $(this).attr('title'),
        url: $(this).attr('url'),
        start: $(this).attr('start') // will be parsed
       });

      });

      callback(events);
     }
    });

On your myxmlfeed.php you can do a $_GET to pull the start date and end date to use when querying your DB. The structure of the XML should be something like this:

<xml>
<event id="1" title="first entry" url="http://www.google.com" start="2010-07-22" /> 
</xml>

You also need to change the jquery.js to version 1.3.2, 1.4.2 does not work properly on IE8.