如何在没有代码的情况下在完整日历中调整事件的大小" editable = true"

时间:2016-07-08 06:34:48

标签: javascript events resize fullcalendar

我需要手动调整fullcalendar中的事件大小,而不需要代码editable=true,因为我在事件中添加了一个下拉列表, 为了解决这个问题,我想要阻止editable属性(editable=false)。现在下拉列表正在运行,但resize属性已消失。即使我尝试了可调整大小的属性(resizable=true)。我怎样才能带上这两个代码?

示例代码

$('#calendar').fullCalendar({
theme: true,
header: {
    left: 'prev,next today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay,agendaFourDay'
},
    views: {
        agendaFourDay: {
            type: 'agenda',
            duration: { days: 4 },
            buttonText: '4 day'
        },
    },

    defaultView: viewDefault,
    //minTime: '07:00:00',
    //maxTime: '21:00:00',
    allDaySlot: false,
    eventClick: updateEvent,
    selectable: true,
    selectHelper: true,
    select: selectDate,
    editable: false,
    resizable: true,
    events: "JsonResponse.ashx?eids=" + eIds + "&searchText=" + searchText,
    //events: {
    //    url: 'JsonResponse.ashx',

    //    type: 'POST',
    //    data: {
    //        eIds: $('#hdnCustomerIds').val()
    //    },
    //    error: function () {
    //        alert('there was an error while fetching events!');
    //    }
    //},
    defaultDate: dateDefault,
    eventDrop: eventDropped,
    eventResize: eventResized,
    eventRender: function (event, element, view) {
        debugger;
        // event.stopPropagation();
        $(element).find('.fc-title').prepend('<a href="javascript:void(0);" class="delete-event-link" style="color:#fff">' + event.customerid + ',</a>');


        $(element).find('.fc-title').html('<select class="dropdown" style="color:black";" onchange="OnchangeEventStatus(this,'+event.id+')"><option >Volvo</option><option value="saab">Saab</option><option value="opel">Opel</option><option value="audi">Audi</option></select>');


        $(element).find('.dropdown').click(function (e) {
            e.stopImmediatePropagation(); //stop click event, add deleted click for anchor link
        });

        $(element).find('.delete-event-link').click(function (e) {
            e.stopImmediatePropagation(); //stop click event, add deleted click for anchor link
            window.top.location.href = "/Sr_App/Customer_Profile.aspx?CustomerId=" + event.customerid;
        });

        //$(element).find('.fc-title').prepend('<a href="javascript:void(0);" class="delete-event-link" style="color:#fff">' + event.customerid + ',</a>');
        element.qtip({
            content: {
                text: qTipText(event.start, event.end, event.description),
                title: '<strong>' + event.title + '</strong>'
            },
            position: {
                my: 'bottom left',
                at: 'top right'
            },
            style: { classes: 'qtip-shadow qtip-rounded' }
        });
    }

});

1 个答案:

答案 0 :(得分:1)

我得到了解决方案,只需为 fullCalendar添加属性editable: false

$('#calendar').fullCalendar({
    selectable: true,
    editable: false,
    events: "JsonResponse.ashx?eids=" + eIds + "&searchText=" + searchText,
    ......
    ....
});