Question

I use JSON to load Full Calendar and include a description for each event in a custom parameter. I want to use jQuery dialog box on eventClick function but don’t know how to specify it. Here is what I’m trying to do:

eventClick: function(calEvent, jsEvent, view) {

        $("#cal_event").dialog({
            title: calEvent.title,
            content: calEvent.description
        });
}

Is there an Object to use where I have indicated “content”? If not, how do I get the calEvent.description into the dialog box?

Thanks for any help you can offer.

Answer 1

Thought I’d post how I ended up doing this to help others reading this post.

I used the following:

$(document).ready(function() {
    $('#calendar').fullCalendar({
        theme: "true",
        aspectRatio: 1.8,
        weekMode: 'liquid',
        header: {
            left: "",
            center: "prev title next",
            right: ""
        },
        buttonIcons:{
            prev: "triangle-1-w",
            next: "triangle-1-e"
        },
        eventSources: [
            {
                url: 'file1.php',  // Event Source One //
                type: 'POST',
                error: function() {
                    alert('there was an error while fetching events!');
                },
                color: '#006600',
                textColor: 'white'
            },
            {
                url: 'file2.php',  // Event Source Two //
                type: 'POST',
                error: function() {
                    alert('there was an error while fetching events!');
                },
                borderColor: '#006600',
                color: 'white',
                textColor: '#333333'
            }
        ],
        eventClick: function(calEvent, jsEvent, view) {
            $("#dialog_frame").css("visibility", "visible");
            $("#dialog_frame").draggable("enable");
            $(".dialog_content").html(calEvent.description);
            $(".dialog_title").html(calEvent.title);         
        }   
    })
});