Javascript 获取arshaw日历中可拖放元素的开始和结束日期
我正在使用arshaw full calendar droppable()的示例 我希望有一次将元素放到日历中,用开始日期和结束日期填充两个字段Javascript 获取arshaw日历中可拖放元素的开始和结束日期,javascript,jquery,fullcalendar,Javascript,Jquery,Fullcalendar,我正在使用arshaw full calendar droppable()的示例 我希望有一次将元素放到日历中,用开始日期和结束日期填充两个字段 <input type="text" id="StartDate" /> <input type="text" id="EndDate" /> 不幸的是,网站()中的droppable部分没有显示如何实现这一点。导入js和css文件,您可以在源代码页中看到代码 $('#my-draggable').draggable({
<input type="text" id="StartDate" />
<input type="text" id="EndDate" />
不幸的是,网站()中的droppable部分没有显示如何实现这一点。导入js和css文件,您可以在源代码页中看到代码
$('#my-draggable').draggable({
revert: true, // immediately snap back to original position
revertDuration: 0 //
});
$('#calendar').fullCalendar({
droppable: true,
minDate:yourDate,
maxDate:yourMaxDate,
drop: function(moment, allDay) {
alert("Dropped on " + moment.format() + " with allDay=" + allDay);
}
});
<div id='external-events'>
<h4>Draggable Events</h4>
<div class='external-event'>My Event 1</div>
<div class='external-event'>My Event 2</div>
<div class='external-event'>My Event 3</div>
<div class='external-event'>My Event 4</div>
<div class='external-event'>My Event 5</div>
<p>
<input type='checkbox' id='drop-remove' />
<label for='drop-remove'>remove after drop</label>
</p>
</div>
<div id='calendar'></div>
$(“#我的可拖动”).draggable({
revert:true,//立即恢复到原始位置
恢复持续时间:0//
});
$(“#日历”).fullCalendar({
真的,
你的约会对象,
maxDate:yourMaxDate,
下降:功能(瞬间、全天){
警报(“在“+moment.format()+”上用allDay=“+allDay”)删除);
}
});
拖拉事件
我的活动1
我的活动2
我的活动3
我的活动4
我的活动5
落下后取出
我找到了解决方案:我添加/修改了drop功能(从网站下载的功能)。
它们会在执行时存储日期:copiedEventObject.start=date
//GET THE START DATE AND MAKE IT IN MILISECONDS
var startDateMiliSeconds = Date.parse(date);
//MY MEETING WILL BE 1HOUR LONG
var endDateMiliSeconds = startDateMiliSeconds + 3600000;
// MAKE BOTH DATES DATE FORMAT
var Startdate = new Date(startDateMiliSeconds);
var EndDate = new Date(endDateMiliSeconds);
//THIS IS TO POPULATE THE INPUTS
$('#StartTime').val(Startdate);
$('#EndTime').val(EndDate);
整个代码如下:
drop:function(date){//在删除某些内容时调用此函数
// retrieve the dropped element's stored Event Object
var originalEventObject = $(this).data('eventObject');
// we need to copy it, so that multiple events don't have a reference to the same object
var copiedEventObject = $.extend({}, originalEventObject);
// assign it the date that was reported
copiedEventObject.start = date;
var startDateMiliSeconds = Date.parse(date);
var endDateMiliSeconds = startDateMiliSeconds + 3600000;
var Startdate = new Date(startDateMiliSeconds);
var EndDate = new Date(endDateMiliSeconds);
//Startdate.toString("dd-mm-YYYY");
//EndDate.toString("dd-mm-YYYY");
// render the event on the calendar
// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
$(this).remove();
$('#StartTime').val(Startdate);
$('#EndTime').val(EndDate);
var edgarFabian = $.type(date); //date is an object
//alert(edgarFabian);
alert(Date.parse(date) );
}
我想你已经理解了我的问题,我问的是drop如何获得开始和结束日期,我没有问如何创建Dropable!