JQuery Calendar控件 | calendarStart

中心：'标题'，右：'月，AgendaWeek，agendaDay' }，可编辑：false， draggable：false，可选：true， selectHelper：true， eventClick：function（calEvent，jsEvent，view）{ // if（calEvent.url）{ // window.open（calEvent.url）; //返回false; //} calEvent.dblclick（函数（ev） { 返回view.trigger（'dblclick'，this，event，ev）; }） }， eventElementHandlers： function（event，eventElement） { var view = this; eventElement .click（函数（ev） { if（！eventElement.hasClass（'ui） -draggable-dragging'）&& ！eventElement.hasClass（'ui-resizable-resizing'）） { return view.trigger（'eventClick'，this，event，ev）; } }） .dblclick（function（ev） { 返回view.trigger（'dblclick'，this，event，ev）; }） .hover（函数（ev） { view.trigger（'eventMouseover'，this，event，ev）; }，函数（ev） { view.trigger（'eventMouseout'，this，event，ev）; } ）; }， eventRender：function（event，element）{ element.bind（'dblclick'，function（）{ $（＃dialog）。dialog（'open'）; if（calEvent.url）{ window。 open（calEvent.url）; 返回false; } //element.find(\".fc-event-title\").html(event.title +：+ event.description +）; alert（'双击！'）; }）; } // dayClick：function（date，allDay，jsEvent，view）{ // $（＃dialog）。dialog（'open'）; //} }）; $（ '.fc-button-today span'）。click（function（）{ var action =today; var view = $（'＃calendar'） .fullCalendar（'getView'）; var strView = view.name; var date = new Date（）; var strStartDate = $ .fullCalendar.formatDate（date，'yyyy-MM-dd'）; //window.location.href=\"../Menu/Calendar.aspx?startCaldate=+ strStartDate + & action =+ action +& view =+ strView; }）; $（'。fc-button-prev span'）。click （功能（）{ var action =prev; var view = $（'＃calendar'）。fullCalendar（'getView'）; var strView = view.name; var loadStartDate = view.start; var strStartDate = $ .fullCalendar.formatDate（loadStartDate，'yyyy-MM-dd'）; var loadEndDate = view.end; var strEndDate = $ .fullCalendar.formatDate（loadEndDate，'yyyy-MM-dd'）; //window.location.href= ../Menu/Calendar.aspx?startCaldate=+ strStartDate +& action =+ action +& view =+ strView +& endCaldate =+ strEndDate; }）; $（'。fc-button-next span'）。click（function（）{ var action =next; var view = $（'#calendar'）。fullCalendar（'getView'）; var strView = view.name; var load StartDate = view.start; var strStartDate = $ .fullCalendar.formatDate（loadStartDate，'yyyy-MM-dd'）; var loadEndDate = view.end; var strEndDate = $ .fullCalendar.formatDate（loadEndDate，'yyyy-MM-dd'）; //window.location.href=\"../Menu/Calendar .aspx？startCaldate =+ strStartDate +& action =+ action +& view =+ strView +& endCaldate =+ strEndDate; }）; $（'＃my-button'）。click（function（）{ var d = $（'＃calendar'）。fullCalendar（'getDate'）; alert（日历的当前日期是+ d）; }）; $（＃dialog）。dialog（{ autoOpen：false，身高：350，宽度：700，模态：真，按钮s：{ '创建事件'：function（）{ $（this）.dialog（'close'）; }，取消：function（）{ $（this）.dialog（'close'）; } }，关闭：function（）{ } }）; }）; 函数showDate（日期，月份，年份，viewName）{ $（'#calendar'）。 fullCalendar（'changeView'，viewName）; $（'＃calendar'）。fullCalendar（'gotoDate'，年，月，日期）; } //用于在日历中添加db事件的javascript 函数addEvents（myid，mytitle，startDate，endDate，url，color）{ // $（'＃calendar'）。fullCalendar（'删除eEvents'，[2]）; var source1 = { 事件：[ { id： myid， title：mytitle， start：startDate， end：endDate， url：url， allDay：false }， ]，颜色：颜色，//一个选项！ textColor：'black'//一个选项！ }; $（'＃calendar'）。 fullCalendar（'addEventSource'，source1）; } 和后端： - 受保护的子CalTaskData（） '加载日历事件尝试 GlobalVar.CalUserId = txtImpersonateUser.Text 如果Request.QueryString.Count<> 0然后 Action = Request.QueryString（action）。ToString（） type = Request.QueryString（view）。ToString（） calStartDate = Request.QueryString（startCaldate）。ToString（） '获取开始日期和结束日期事件如果Action =next那么 calendarStart = Date.Parse（calStartDate） calendarStart = DateSerial（calendarStart.Year，calendarStart。月，1） calendarStart = calendarStart.AddMonths（-1） calendarEnd = calendarStart.AddMonths（3） dateStart = Format（calendarStart ，yyyy-MM-dd） dateEnd =格式（CDate（calendarEnd），yyyy-MM-dd） intStDt =格式（CDate（dateStart），yyyyMMdd） intEnDt =格式（CDa te（dateEnd），yyyyMMdd） ElseIf Action =prev然后 calendarStart = Date.Parse（calStartDate） calendarStart = DateSerial（calendarStart.Year，calendarStart.Month，1） calendarStart = calendarStart.AddMonths（-2） calendarEnd = calendarStart.AddMonths（3） dateStart =格式（calendarStart，yyyy-MM-dd） dateEnd =格式（CDate（calendarEnd），yyyy-MM-dd） intStDt =格式（CDate（dateStart），yyyyMMdd） intEnDt =格式（CDate（dateEnd），yyyyMMdd）结束如果 '更改日历视图如果操作=下一步那么如果type =month那么 calendarStart = Date.Parse （calStartDate） calendarStart = calendarStart.AddMonths（1） ScriptManager.RegisterClientScriptBlock（Me.Page，GetType（String），gotoNextDate，; $（function（）{showDate（'& calendarStart.Day& '，'& calendarStart.Month - 1& '，'& calendarStart.Year& '，'&类型& '）;}）;，True） ElseIf type =agendaWeek然后 calendarStart = Date.Parse（calStartDate） calendarStart = calendarStart.AddDays（7） ScriptManager.RegisterClientScriptBlock（Me.Page，GetType（String），gotoNextDate，; $（function（）{showDate（'& calendarStart.Day &'，'& calendarStart.Month - 1&'，'& calendarStart.Year&'，'& type&'）;}）;，True） ElseIf type =agendaDay然后 calendarStart = Date.Parse（calStartDate） calendarStart = calendarStart.AddDays（1） ScriptManager.RegisterClientScriptBlock（Me.Page，GetType（String），gotoNextDate，; $（function（）{showDate（'& calendarStart.Day&'，'& calendarStart.Month - 1&'，'& calenda rStart.Year&'，'&类型& '）;}）;，True）结束如果 ElseIf Action =prev那么如果type =month然后 calendarStart = Date.Parse（calStartDate） calendarStart = calendarStart.AddMonths（-1） ScriptManager.RegisterClientScriptBlock（Me.Page， GetType（String），gotoPrevDate，; $（function（）{showDate（'& calendarStart.Day&'，'& calendarStart.Month - 1&'，'& calendarStart .Year&'，'& type&'）;}）;，True） ElseIf type =agendaWeek那么 calendarStart = Date.Parse（calStartDate） calendarStart = calendarStart.AddDays（-7） ScriptManager.RegisterClientScriptBlock（Me.Page，GetType（String），gotoPrevDate，; $（function（）{showDate（'& cal endarStart.Day& '，'& calendarStart.Month - 1& '，'& calendarStart.Year& '，'&类型& '）;}）;，True） ElseIf type =agendaDay然后 calendarStart = Date.Parse（calStartDate） calendarStart = calendarStart.AddDays（-1） ScriptManager.RegisterClientScriptBlock（Me.Page，GetType（String），gotoPrevDate，; $（function（）{showDate（'& calendarStart。 Day&'，'& calendarStart.Month - 1&'，'& calendarStart.Year&'，'& type&'）;}）;，True）结束如果 ElseIf动作=今天然后 dateStart =格式（Now.Date，yyyy-MM-01） dateEnd =格式（Now.Date.AddMonths（1），yyyy-MM-01） intStDt =格式（CDate（dateStart），yyyyMMdd） intEnDt =格式（CDate（dateEnd），yyyyMMdd）结束如果否则如果searchDate = True那么 Dim strtDate As Date strtDate = txtCalDate.Text dateStart = Format （strtDate.AddMonths（-2），yyyy-MM-01） dateEnd =格式（strtDate.AddMonths（2），yyyy-MM-01） intStDt =格式（CDate（dateStart），yyyyMMdd） intEnDt =格式（CDate（dateEnd），yyyyMMdd）否则 dateStart =格式（Now.Date.AddMonths（-2），yyyy-MM-01） dateEnd =格式（Now.Date.AddMonths（2），yyyy-MM -01） intStDt =格式（CDate（dateStart），yyyyMMdd） intEnDt =格式（CDate（dateEnd），yyyyMMdd）结束如果结束如果 '加载所有任务事件。 loadVisit（） loadQuote（） loadPhoneCall（） loadOtherTask（） loadEmail（） loadDemo（） loadMeeting（） Catch ex As Exception 最后 'MsgBox（ex.Message）结束尝试结束SubI Used JQuery full calendar control.PRoblem is that i bind data to it. it works fine but it not show data to only one person and for others it work fine.My code:-$(document).ready(function() { DatePicker(); var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); $('#calendar').fullCalendar({ showTime: true, theme: true, defaultView:'agendaDay', header: { left: 'prev,next, today', center: 'title', right: 'month,agendaWeek,agendaDay' }, editable: false, draggable: false, selectable: true, selectHelper: true, eventClick: function(calEvent, jsEvent, view) {// if (calEvent.url) {// window.open(calEvent.url);// return false;// } calEvent.dblclick(function (ev) { return view.trigger('dblclick', this, event, ev); }) }, eventElementHandlers: function (event, eventElement) { var view = this; eventElement .click(function (ev) { if (!eventElement.hasClass('ui-draggable-dragging') && !eventElement.hasClass('ui-resizable-resizing')) { return view.trigger('eventClick', this, event, ev); } }) .dblclick(function (ev) { return view.trigger('dblclick', this, event, ev); }) .hover( function (ev) { view.trigger('eventMouseover', this, event, ev); }, function (ev) { view.trigger('eventMouseout', this, event, ev); } ); }, eventRender: function(event, element) { element.bind('dblclick', function() { $("#dialog").dialog('open'); if (calEvent.url) { window.open(calEvent.url); return false; } //element.find(".fc-event-title").html(event.title + ": " + event.description + ""); alert('double click!'); }); } // dayClick: function (date, allDay, jsEvent, view) { // $("#dialog").dialog('open'); // } }); $('.fc-button-today span').click(function(){ var action="today"; var view = $('#calendar').fullCalendar('getView'); var strView = view.name; var date = new Date(); var strStartDate = $.fullCalendar.formatDate(date, 'yyyy-MM-dd'); //window.location.href="../Menu/Calendar.aspx?startCaldate=" + strStartDate + "&action=" + action + "&view=" + strView; }); $('.fc-button-prev span').click(function(){ var action="prev"; var view = $('#calendar').fullCalendar('getView'); var strView = view.name; var loadStartDate = view.start; var strStartDate = $.fullCalendar.formatDate(loadStartDate, 'yyyy-MM-dd'); var loadEndDate = view.end; var strEndDate = $.fullCalendar.formatDate(loadEndDate, 'yyyy-MM-dd'); //window.location.href="../Menu/Calendar.aspx?startCaldate=" + strStartDate + "&action=" + action + "&view=" + strView + "&endCaldate="+ strEndDate; }); $('.fc-button-next span').click(function(){ var action="next"; var view = $('#calendar').fullCalendar('getView'); var strView = view.name; var loadStartDate = view.start; var strStartDate = $.fullCalendar.formatDate(loadStartDate, 'yyyy-MM-dd'); var loadEndDate = view.end; var strEndDate = $.fullCalendar.formatDate(loadEndDate, 'yyyy-MM-dd'); //window.location.href="../Menu/Calendar.aspx?startCaldate=" + strStartDate + "&action=" + action + "&view=" + strView + "&endCaldate="+ strEndDate; }); $('#my-button').click(function() { var d = $('#calendar').fullCalendar('getDate'); alert("The current date of the calendar is " + d); }); $("#dialog").dialog({ autoOpen: false, height: 350, width: 700, modal: true, buttons: { 'Create event': function () { $(this).dialog('close'); }, Cancel: function () { $(this).dialog('close'); } }, close: function () { } }); }); function showDate(date,month,year,viewName){ $('#calendar').fullCalendar( 'changeView', viewName ); $('#calendar').fullCalendar( 'gotoDate', year, month, date); } // javascript for adding db events in calendar function addEvents(myid,mytitle, startDate, endDate, url, color) { //$('#calendar').fullCalendar( 'removeEvents', [2]); var source1 = { events: [ { id: myid, title: mytitle, start: startDate, end : endDate, url : url, allDay: false }, ], color: color, // an option! textColor: 'black' // an option! }; $('#calendar').fullCalendar('addEventSource', source1);}and back end:- Protected Sub CalTaskData() 'Load Calendar Events Try GlobalVar.CalUserId = txtImpersonateUser.Text If Request.QueryString.Count <> 0 Then Action = Request.QueryString("action").ToString() type = Request.QueryString("view").ToString() calStartDate = Request.QueryString("startCaldate").ToString() 'get Start date and End date of events If Action = "next" Then calendarStart = Date.Parse(calStartDate) calendarStart = DateSerial(calendarStart.Year, calendarStart.Month, 1) calendarStart = calendarStart.AddMonths(-1) calendarEnd = calendarStart.AddMonths(3) dateStart = Format(calendarStart, "yyyy-MM-dd") dateEnd = Format(CDate(calendarEnd), "yyyy-MM-dd") intStDt = Format(CDate(dateStart), "yyyyMMdd") intEnDt = Format(CDate(dateEnd), "yyyyMMdd") ElseIf Action = "prev" Then calendarStart = Date.Parse(calStartDate) calendarStart = DateSerial(calendarStart.Year, calendarStart.Month, 1) calendarStart = calendarStart.AddMonths(-2) calendarEnd = calendarStart.AddMonths(3) dateStart = Format(calendarStart, "yyyy-MM-dd") dateEnd = Format(CDate(calendarEnd), "yyyy-MM-dd") intStDt = Format(CDate(dateStart), "yyyyMMdd") intEnDt = Format(CDate(dateEnd), "yyyyMMdd") End If 'Changing view of calendar If Action = "next" Then If type = "month" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddMonths(1) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoNextDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "','" & type & "');});", True) ElseIf type = "agendaWeek" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddDays(7) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoNextDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "','" & type & "');});", True) ElseIf type = "agendaDay" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddDays(1) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoNextDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "','" & type & "');});", True) End If ElseIf Action = "prev" Then If type = "month" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddMonths(-1) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoPrevDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "', '" & type & "');});", True) ElseIf type = "agendaWeek" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddDays(-7) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoPrevDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "','" & type & "');});", True) ElseIf type = "agendaDay" Then calendarStart = Date.Parse(calStartDate) calendarStart = calendarStart.AddDays(-1) ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "gotoPrevDate", ";$(function(){showDate('" & calendarStart.Day & "','" & calendarStart.Month - 1 & "','" & calendarStart.Year & "','" & type & "');});", True) End If ElseIf Action = "today" Then dateStart = Format(Now.Date, "yyyy-MM-01") dateEnd = Format(Now.Date.AddMonths(1), "yyyy-MM-01") intStDt = Format(CDate(dateStart), "yyyyMMdd") intEnDt = Format(CDate(dateEnd), "yyyyMMdd") End If Else If searchDate = True Then Dim strtDate As Date strtDate = txtCalDate.Text dateStart = Format(strtDate.AddMonths(-2), "yyyy-MM-01") dateEnd = Format(strtDate.AddMonths(2), "yyyy-MM-01") intStDt = Format(CDate(dateStart), "yyyyMMdd") intEnDt = Format(CDate(dateEnd), "yyyyMMdd") Else dateStart = Format(Now.Date.AddMonths(-2), "yyyy-MM-01") dateEnd = Format(Now.Date.AddMonths(2), "yyyy-MM-01") intStDt = Format(CDate(dateStart), "yyyyMMdd") intEnDt = Format(CDate(dateEnd), "yyyyMMdd") End If End If 'Load all Task Events. loadVisit() loadQuote() loadPhoneCall() loadOtherTask() loadEmail() loadDemo() loadMeeting() Catch ex As Exception Finally 'MsgBox(ex.Message) End Try End Sub推荐答案（document）.ready（function（）{ DatePicker（）; var date = new Date（）; var d = date.getDate（）; var m = date.getMonth（）; var y = date.getFullYear （）;(document).ready(function() { DatePicker(); var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear();（'＃calendar'）。fullCalendar（{ showTime：true，主题：true， defaultVie w：'agendaDay'，标题：{ 左：'上一个，下一个，今天'， center：'title'， right：'month，agendaWeek，agendaDay' }，可编辑：false， draggable：false，可选：true， selectHelper：true， eventClick： function（calEvent，jsEvent，view）{ // if（calEvent.url）{ // window.open（calEvent.url）; //返回false; //} calEvent.dblclick（函数（ev） { 返回view.trigger（'dblclick'，this，event，ev）; }） }， eventElementHandlers：function（event，eventElement） { var view = this; eventElement .click（函数（ev） { if（！eventElement.hasClass（'ui） -draggable-dragging'）&& ！eventElement.hasClass（'ui-resizable-resizing'）） { return view.trigger（'eventClick'，this，event，ev）; } }） .dblclick（function（ev） { 返回view.trigger（'dblclick'，this，event，ev）; }） .hover（函数（ev） { view.trigger（'eventMouseover'，this，event，ev）; }，函数（ev） { view.trigger（'eventMouseout'，this，event，ev）; } ）; }， eventRender：function（event，element）{ element.bind（'dblclick'，function（）{('#calendar').fullCalendar({ showTime: true, theme: true, defaultView:'agendaDay', header: { left: 'prev,next, today', center: 'title', right: 'month,agendaWeek,agendaDay' }, editable: false, draggable: false, selectable: true, selectHelper: true, eventClick: function(calEvent, jsEvent, view) {// if (calEvent.url) {// window.open(calEvent.url);// return false;// } calEvent.dblclick(function (ev) { return view.trigger('dblclick', this, event, ev); }) }, eventElementHandlers: function (event, eventElement) { var view = this; eventElement .click(function (ev) { if (!eventElement.hasClass('ui-draggable-dragging') && !eventElement.hasClass('ui-resizable-resizing')) { return view.trigger('eventClick', this, event, ev); } }) .dblclick(function (ev) { return view.trigger('dblclick', this, event, ev); }) .hover( function (ev) { view.trigger('eventMouseover', this, event, ev); }, function (ev) { view.trigger('eventMouseout', this, event, ev); } ); }, eventRender: function(event, element) { element.bind('dblclick', function() {（＃dialog）。dialog（'open'）; if（calEvent.url）{ window.open（calEvent.url）; 返回false; } //element.find(\".fc-event-title\").html(event.title +：+ event.description +）; alert（'双击！'）; }）; } // dayClick：function（date，allDay，jsEvent，view）{ //("#dialog").dialog('open'); if (calEvent.url) { window.open(calEvent.url); return false; } //element.find(".fc-event-title").html(event.title + ": " + event.description + ""); alert('double click!'); }); } // dayClick: function (date, allDay, jsEvent, view) { // 这篇关于JQuery Calendar控件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！