JQuery tüm takvim, görünüm nasıl değiştirilir

Question

JQuery Tam Takvim uygulamasını kullanıyorum ama biraz farklı görünüme ihtiyacım var, - ay görünümünde görevleri gösterme, yalnızca farklı etkinliklerle ilişkili olayların olduğu renk günleri Hiçbir olay olmadan günlerden daha fazla renk. Daha sonra kullanıcı ayın görünümünde bu günü tıkladığında - tüm olayları gösteren bu güne ait bir gün görünümü açılır.

Böyle bir ayar yapmak mümkün mü? Teşekkür ederim. yerine (olayları görmek ve bir uyarının tıkla Mart gidin) o isteseydi

Answer 1

http://webdesignandseo.net/jquery/datepicker/

Aslında normal bir jQuery DatePicker yapabilirsiniz. Ben nasıl Tam Takvim Eklentisi eserleri hakkında fazla bilgim yok ama yardımcı olacaktır belgelerinde bir şey olabilir:

http://arshaw.com/fullcalendar/docs/

Answer 2

İki beslemeleri

Sunucum getiri

kullanarak bu yapmış feedBasic ve feedComplex

feedBasic, aynı etkinlikte kaç tane daha var olursa olsun ayın yalnızca bir etkinliğini gösterir. Tıklayın ve ay görüntüsüne geçip tam feed'i yükleyin.

Belki bu kod size yardımcı olabilir. Kodun bütçesidir, ancak 4 yayın + google takvimi kullanır. Birkaç hata var, ancak çalışan temel işlevselliği.

$(document).ready(function() { 

     var lastView; 

     $('#calendar').fullCalendar({ 
      header: { 
       left: 'today', 
       center: 'prev,title,next', 
       right: 'month,basicDay' 
      }, 
      slotMinutes: 30, 
      firstHour: 5, 
      editable: false, 
      timeFormat: 'H:mm', 
      firstday: 0, //Sunday0 Monday1..etc 
      allDayDefault : true, 
      //loading: function(bool) { if (bool) $('#loadingImg').show(); else $('#loadingImg').hide(); alert($('#calendar').fullCalendar('clientEvents')) }, 

      loading: function(bool) { if (bool) $('#loadingImg').show(); else $('#loadingImg').hide(); }, 

      //VIEW CHANGE - ALSO ADDS INITIAL SOURCES PER DAY VIEW 
      viewDisplay: function(view) { 
             if (lastView == undefined) { lastView = 'firstRun'; } 

             if (view.name != lastView) 
             { 

               if (view.name == 'month') 
                { 
                if ('<%=brsEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=brsComplex'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=brsBasic');  } 
                if ('<%=activeEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=fixturesComplex'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=fixturesBasic'); } 
                if ('<%=previousEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=previousComplex'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=previousBasic'); } 
                if ('<%=newsEventEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=newsEvents'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=newsEvents'); } 
                } 
               if (view.name == 'basicDay') 
                { 
                if ('<%=brsEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=brsBasic'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=brsComplex'); } 
                if ('<%=activeEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=fixturesBasic'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=fixturesComplex'); } 
                if ('<%=previousEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=previousBasic'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=previousComplex'); } 
                if ('<%=newsEventEnabled %>' == 'True') { $('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=newsEvents'); $('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=newsEvents'); } 
                } 

             lastView = view.name; 
             } 
            }, 

      //EVENT CLICK 
      eventClick: function(event, jsEvent, view) 
      { 
       //STOP GOOGLE LINK FROM FOLLOWING THROUGH ON ALL OCCASIONS 
       if (event.url != undefined) { if (event.url.indexOf("google") > 0) { return false; } } 

       if (event.newsEvent == "True") 
        { 
         //SOME OTHER SPECIFIC FUNCTION 
        } 
        else 
        { 
         var view = $('#calendar').fullCalendar('getView'); 
         if (view.name == 'month') 
         { 
          $('#calendar').fullCalendar('changeView', 'basicDay'); 
          $('#calendar').fullCalendar('gotoDate', event.start); 
         } 
         if (view.name == 'basicDay') 
         { 
          //HANDLES CLICK OF EVENT IN DAY VIEW TO EXPAND DIV WITH EXTRA INFORMATION 

         } 
        } 
      }, 

      //HOVER 
      //eventMouseover: function(event, jsEvent, view) { if (event.PopUp == 'yes') { $(this).CreateBubblePopup({ innerHtml: + '<br/>Click for more infromation.' , themePath: 'images/bubblepopup-theme', themeName: 'black' }); } } , 

      //DAY CLICK 
      //dayClick: function(event, jsEvent, view) { alert("Day Clicked.. Booking?") } , 

      //ALL COMBINED INITIAL FEEDS 
      eventSources: [ <%=myGoogleCalendars %> ] 

     }); 

     //ATTACHING A LOADING IMAGE 
     $('.fc-header-title').append('<img id="loadingImg" style="width:16px; height:11px; float:none; margin-top: -25px;" src="images/loadingSmall.gif" />'); 

     //HDID FILTER 
     if ('<%=activeEnabled %>' == 'True') { 

     $('.fc-header-left').append('<span class="fc-button fc-button-today fc-state-default fc-corner-left fc-corner-right fc-state-active"><span class="fc-button-inner"><span id="filterHDID" class="fc-button-content">hdid</span><span class="fc-button-effect"><span></span></span></span></span>'); 
     $("#filterHDID").click(function() { if ($(this).parents('span').hasClass('fc-state-active')) 
      { 
       $('.data-fixtures').css('display', 'none') 
       $(this).parents('span').removeClass('fc-state-active'); 
       if ('<%=previousEnabled %>' == 'True') { $('.data-previous').css('display', 'none'); 
                 } 
      } 
      else 
      { 
       $('.data-fixtures').css('display', 'inline') 
       $(this).parents('span').addClass('fc-state-active'); 
       if ('<%=previousEnabled %>' == 'True') { $('.data-previous').css('display', 'inline') 
                 } 
       }    }); 
     } 


     //BRS FILTER 
     if ('<%=brsEnabled %>' == 'True') { 

     $('.fc-header-left').append('<span class="fc-button fc-button-today fc-state-default fc-corner-left fc-corner-right fc-state-active"><span class="fc-button-inner"><span id="filterBRS" class="fc-button-content">brs</span><span class="fc-button-effect"><span></span></span></span></span>'); 
     $("#filterBRS").click(function() { if ($(this).parents('span').hasClass('fc-state-active')) 
      { 
       $('.data-brs').css('display', 'none') 
       //$('#calendar').fullCalendar('removeEventSource', '/diaryFeed.aspx?style=brs'); 
       $(this).parents('span').removeClass('fc-state-active'); 
      } 
      else 
      { 
       $('.data-brs').css('display', 'inline') 
       //$('#calendar').fullCalendar('addEventSource', '/diaryFeed.aspx?style=brs'); 
       $(this).parents('span').addClass('fc-state-active'); 
       }    }); 
     } 

     //GOOGLE FEED FILTER 
     if ('<%=googleEnabled %>' == 'True') { 

      $('.fc-header-left').append('<span class="fc-button fc-button-today fc-state-default fc-corner-left fc-corner-right fc-state-active"><span class="fc-button-inner"><span id="filterGCAL" class="fc-button-content">google</span><span class="fc-button-effect"><span></span></span></span></span>'); 
      $("#filterGCAL").click(function() { if ($(this).parents('span').hasClass('fc-state-active')) 
      { 
       $('#calendar').fullCalendar('removeEventSource', <%=myGoogleCalendars%>); $(this).parents('span').removeClass('fc-state-active'); 
      } 
      else 
      { 
       $('#calendar').fullCalendar('addEventSource', <%= myGoogleCalendars%>); $(this).parents('span').addClass('fc-state-active'); 
       }    }); 
     } 

     //MORE 



    }); 
</script> 

Olması gereken bir video. Gereksinim duyduğunuz şekilde takın Görünümler arasında geçiş yaparken çoğaltmalar oluşturulmadan çalışan bir çözümdür.

Answer 3

. yüklediğiniz görünüme bağlı olarak iki farklı veri kaynağı grubu yükler. Onunla ppumkins yardımı yaptım. addEventSource ve removeEventSource çağrılarının sırasına dikkat edin. Benim için ben başka türlü çiftleri i i fullcalendar benim uygulamasında kullanabileceğiniz kod üzerinde bir sürü olduğunu düşünüyorum favori olarak bu ekledik

http://dev2.mycmo.com.au/fullcalendar/calendar_problem_demo.php