要使用完整的日历jquery插件作为谷歌日历

我正在使用jQuery fullcalendar插件。为事件提供拖动和调整大小选项。要使用完整的日历jquery插件作为谷歌日历

我喜欢像谷歌日历一样添加事件和编辑事件。

任何其他插件是有衬托出谷歌日历的功能jQuery的

如何做到这一点？

更新

.... 

eventClick: function(calEvent, jsEvent, view) { 
    alert('Event: ' + calEvent.id); 
    // alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY); 
    // alert('View: ' + view.name); 

    // change the border color just for fun 
    // $(this).css('border-color', 'red'); 

    tb_show("Edit Event","event_edit.php?event_obj="+calEvent+"&event_title="+calEvent.title+"&keepThis=true&TB_iframe=true&height=250&width=400"); 
}, 

.....

calEvent是一个对象，我打电话的iframe ThickBox的弹出，所以我不能保持对象。

calEvent在另一页中。

来源

2011-06-04 Mohan Ram

我不确定这里有什么问题。我刚刚完成了相当大的日历项目。我使用jquery fullcalendar插件。我认为这是一个很好的基础，建立一个几乎相同的谷歌日历思想。我的建议是坚持这个伟大的插件。 – alyo 2011-06-04 06:37:01

如何使用与Google日历相同的弹出窗口来添加，编辑事件。我不能获取值 – 2011-06-04 07:17:14

我正在使用jquery来显示一个“弹出” - 隐藏显示div与窗体提交新的数据到数据库。然后我使用JSON添加数据。使用PHP获取jquery fullcalendar的事件 - 请参阅此示例：http://arshaw.com/js/fullcalendar-1.5.1/demos/json.html 如果您有任何具体问题，请不要犹豫，问问。 – alyo 2011-06-04 07:56:41

，这里是我的fullcalendar的init里面“添加事件”部分：

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


       var txt = '<h3>Add event:</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 />';      

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

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

       function addeventnow(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'); 

       } 

      },

不要”打扰了‘语言’和‘CI’stuff..this只是在为本地化与笨的字符串，其是我的选择框架。

来源

2011-06-04 13:27:25 alyo

要使用完整的日历jquery插件作为谷歌日历

回答

相关问题