fullcalender，events，popup [英] fullcalender, events, popup

问题描述

大家好，



我正在使用带弹出事件的完整日历。但是，如果您点击没有活动的日期，然后您点击事件，事件将显示上一个日期。

 < span class =code-leadattribute>< script     src   =  @ Url.Content（ 〜/ Scripts / moment.js）     type   =  text / javascript >  < /   script  >  
 
  < script  >  
 $（document）.ready（function（）{
 
  var  sourceFullView = {url：'  / Calendar / GetDiaryEvents /'}; 
  var  sourceSummaryView = {url：'  / Calendar / GetDiarySummary /'}; 
  var  CalLoading =  true ; 
 
 
 
 
 $（'  #calendar' ）。fullCalendar（{
 header：{
 left：'  prev，next今天'，
中心：'  title'，
 right ：'  month，agendaWeek，agendaDay' 
}，
 defaultView：'  month'，
可编辑： true ，
 allDaySlot： false ，
可选： true ，
 slotMinutes： 25 ，
 eventClick：function（calEven） t，jsEvent，view）{
 
 
 
  var  durationEvent = calEvent.end  -  calEvent.start; 
  var  title = $（' ＃eventTitle ）VAL（）; 
 $（ ＃popupEventForm）。find（  form）。find（  #eventTitle）。attr（' 占位符'，calEvent.title）; 
 $（ ＃eventDate）。html（moment（calEvent.EventStart）.format （'  MMM Do h：mm A'））; 
  //   $（＃popupEventForm）。find（form）。find（＃eventDate ）。attr（calEvent.EventStart）;  
 
 
 $（ ＃popupEventForm）。find（calEvent.start）.html（moment（ ＃eventDate ）。format（（'  MMM Do h：mm A'）））; 
 $（' ＃popupEventForm'）。show（）; 

< br $>


}



谢谢





这是弹出窗口：

< pre lang =   xml>< div id =   popupEventForm  class  =  模态隐藏 >  
< div  class  =   modal-header>< h3>约会< /   h3  >  < /   div  >  
< div  class  =   modal-body >  
< ; form id =   EventForm  class  =   well >  
< input type =   hidden id =    eventID >  
< label>事件标题< /  标签 >  
< input type =   text id =   eventTitle>< br /> 
< label>预定日期< /  标签 >  
< input type =   text id =   eventDate>< br /> 
< label>预定时间< /  标签 >  
< input type =   text id =   eventTime>< br /> 
< label>约会时长（分钟）< /   label  >  
< input type =   text id =   eventDuration>< br /> 
 < /  表格 >  
 < /   div  >  
< div  class  =  模态页脚 >  
< button type =   button id =   btnPopupCancel数据-dismiss =   modal  class  =   btn>取消< /  按钮 >  
< button type =  按钮 id =   btnPopupSave data-dismiss =   modal  class  =   btn btn-success>保存 event  < /  按钮 >  
< button type =   button id =   btnPopupDelete data-dismiss =    modal  class  =   btn btn-danger right>删除事件 < /  按钮 >  
 < /   div  >  
 < /   div  >  

解决方案

（document）.ready（function（）{

var sourceFullView = {url：' / Calendar / GetDiaryEvents /'};
var sourceSummaryView = {url：' / Calendar / GetDiarySummary /'};
var CalLoading = true ;

（< span class =code-string>' ＃calendar'）。fullCalendar（{
header：{
left：< span class =code-string>' prev，next today'，
center： ' title'，
right：' month，agendaWeek，agendaDay'
}，
defaultView：' 月'，
可编辑： true ，
allDaySlot： false ，
可选： true ，
slotMinutes：< span class =code-digit> 25 ，
eventClick：function（calEvent，jsEvent，view）{



var durationEvent = calEvent.end - calEvent.start;
var title =

（' ＃EVENTTITLE'）VAL（）;

Hi everybody,

I am using full calender with popup event. But if you click on a date without event and then you click on a event the previous date is showing by the event.

<script src="@Url.Content("~/Scripts/moment.js")" type="text/javascript"></script>

    <script>
        $(document).ready(function () {

            var sourceFullView = { url: '/Calendar/GetDiaryEvents/' };
            var sourceSummaryView = { url: '/Calendar/GetDiarySummary/' };
            var CalLoading = true;


          

            $('#calendar').fullCalendar({
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                },
                defaultView: 'month',
                editable: true,
                allDaySlot: false,
                selectable: true,
                slotMinutes: 25,
                eventClick: function (calEvent, jsEvent, view) {
                   
                    

                    var durationEvent = calEvent.end - calEvent.start;
                    var title = $('#eventTitle').val();
                    $("#popupEventForm").find("form").find("#eventTitle").attr('placeholder', calEvent.title);
                    $("#eventDate").html(moment(calEvent.EventStart).format('MMM Do h:mm A'));
                    //$("#popupEventForm").find("form").find("#eventDate").attr(calEvent.EventStart);

                    
                    $("#popupEventForm").find(calEvent.start).html(moment("#eventDate").format(('MMM Do h:mm A')));                  
                    $('#popupEventForm').show();

}

Thank you


this is the popup:

<pre lang="xml"><div id="popupEventForm" class="modal hide">
    <div class="modal-header"><h3>Appointment</h3></div>
    <div class="modal-body">
        <form id="EventForm" class="well">
            <input type="hidden" id="eventID">
            <label>Event title</label>
            <input type="text" id="eventTitle"><br />
            <label>Scheduled date</label>
            <input type="text" id="eventDate"><br />
            <label>Scheduled time</label>
            <input type="text" id="eventTime"><br />
            <label>Appointment length (minutes)</label>
            <input type="text" id="eventDuration"><br />
        </form>
    </div>
    <div class="modal-footer">
        <button type="button" id="btnPopupCancel" data-dismiss="modal" class="btn">Cancel</button>
        <button type="button" id="btnPopupSave" data-dismiss="modal" class="btn btn-success ">Save event</button>
        <button type="button" id="btnPopupDelete" data-dismiss="modal" class="btn btn-danger right ">Delete event</button>
    </div>
</div>

解决方案

(document).ready(function () { var sourceFullView = { url: '/Calendar/GetDiaryEvents/' }; var sourceSummaryView = { url: '/Calendar/GetDiarySummary/' }; var CalLoading = true;

('#calendar').fullCalendar({ header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, defaultView: 'month', editable: true, allDaySlot: false, selectable: true, slotMinutes: 25, eventClick: function (calEvent, jsEvent, view) { var durationEvent = calEvent.end - calEvent.start; var title =

('#eventTitle').val();

这篇关于fullcalender，events，popup的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！