要使用完整的日曆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插件作爲谷歌日曆

回答

相關問題