开发者

FullCalendar - Pass Select Function to Div

This may sound rather simple but how do you pass the variables of the SELECT function to populate a div form?

I've successfully set up FC and use the SELECT function to trigger the appearance of a form "new_event".

select: function( startDate, endDate, allDay, jsEvent, view) {
$("#new_event").show();
},

I now need to populate the form with the startDate etc. Once completed the form will then ma开发者_StackOverflowke the necessary changes to a mySQl backend via PHP.


Here is my select which generates the add event form

select: function(start, end, allDay) {
                var calendars = getAjaxData('calendar/calendarsJson');


                var txt = '<h3>Dodaj nov dogodek:</h3>\n\
                           <div class="clear"></div>\n\
                           <p><label>'+CI.lang.language.what+':</label><input type="text"  name="title" value="" /></p>\n\
                           <p><label>'+CI.lang.language.where+':</label><input type="text"  name="location" value="" /></p>\n\
                           <p><label>'+CI.lang.language.description+':</label></p>\n\
                           <p><textarea  name="description"></textarea></p>';
                txt += '<p><label>'+CI.lang.language.calendar+':</label>\n\
                            <select name="id_calendar">';
                for(i=0;i<calendars.length;i++) {
                    txt += '<option value="'+calendars[i].id_calendar+'">'+calendars[i].title+'</option>';
                }
                txt += '</select></p>';
                txt += '<br />';
                //txt += '<input type="button" value="'+CI.lang.language.create_event+'" />'

                var btns = {};
                btns[CI.lang.language.create_event] = true
                btns[CI.lang.language.cancel] = false;

                $.prompt(txt,{
                    prefix:'event_box',
                    callback: dodaj,
                    buttons: btns
                });                

                function dodaj(v,m,f){

                    if(f && v){
                        var classN = getAjaxData('calendar/getClassJson/'+f.id_calendar);
                        var nEvent = {
                            title: f.title,
                            description: f.description,
                            location: f.location,
                            start: start,
                            end: end,
                            allDay: allDay,
                            className: classN,
                            id_calendar: f.id_calendar

                        };
                        if (f.title) {
                            calendar.fullCalendar('renderEvent',
                                nEvent,
                                false // make the event "stick"
                            );
                        }
                        addEvent(nEvent);
                        calendar.fullCalendar('refetchEvents');
                    }

                     calendar.fullCalendar('unselect');

                }

        },

Here is the addEvent function which submits new data to db using JSON:

function addEvent(event) {
    var start = my_convertDate(new Date(event.start));
    var end;

    if(event.end === null) {
         end = start;
    } else {
         end = my_convertDate(new Date(event.end));
    }

    if((event.allDay)){
        event.allDay = 1
    } else {
        event.allDay = 0;
    }

    var eventData = {
        start_date : start.date,
        start_time : start.time,
        end_date : end.date,
        end_time : end.time,
        id_event : event.id,
        all_day : event.allDay,
        title: event.title,
        className: event.className,
        location: event.location,
        description: event.description,
        id_calendar: event.id_calendar
    }

    makeAjaxRequest('event/addEventJson', eventData);
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜