2013-09-13 4 views
0

FullCalendar dayClick не работает в моем проекте до тех пор, пока пользователь не вернется или не перейдет через месяц, а затем обратно в текущий месяц. Я унаследовал этот проект и не имел никакого предыдущего опыта работы с функциями календаря, поэтому я не уверен, с чего начать, за исключением публикации разметки, связанной с одним из календарей. Я довольно новичок в StackOverflow, поэтому дайте мне знать, если мне нужно опубликовать какие-либо другие данные. Спасибо заранее за любые предложения.FullCalendar dayClick не работает до тех пор, пока не будет изменен месяц

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="PersonalCalendar.ascx.cs" Inherits="Controls_Events_PersonalCalendar" %> 
<link id="lnkCSSFiles" type="text/css" media="screen, projection" rel="stylesheet" href="~/css/fullcalendar.css" runat="server" /> 
<div class="rightCol"> 
    <div class="search masked formWhole"> 
     <label for="searchBox"> 
      Search</label> 
     <asp:TextBox ID="txtSearch" CssClass="text" runat="server" /> 
     <asp:Button ID="btnSearch" CssClass="button" Text="Search" OnClick="btnSearch_Click" 
      runat="server" /> 
    </div> 
</div> 
<div> 
    <asp:ListView ID="lsvSearch" runat="server"> 
     <LayoutTemplate> 
      <h3> 
       Search Results</h3> 
      <asp:PlaceHolder ID="itemPlaceHolder" runat="server" /> 
     </LayoutTemplate> 
     <ItemTemplate> 
      <div class="eventList"> 
       <a href="<%#((EventsWrapper)Container.DataItem).URL %>" class="eventTitle"> 
        <%# ((EventsWrapper)Container.DataItem).Title%></a> <span class="eventDate"> 
         <%# ((EventsWrapper)Container.DataItem).StartDate%></span> <span class="eventLocation"> 
          in 
          <%# ((EventsWrapper)Container.DataItem).City%></span> <a class="more" href="<%#((EventsWrapper)Container.DataItem).URL %>"> 
           View Event &raquo;</a> 
      </div> 
     </ItemTemplate> 
    </asp:ListView> 
</div> 
<div id="genWidget" class="calendarWidget" runat="server"> 
    <div id="calendar"> 
    </div> 
</div> 
<!--end Calendar Widget--> 
<asp:Literal ID="litJavaScripts" Text="~/tft-js/core/fullcalendar.js,~/tft-js/core/jquery.dateformat.js,~/tft-js/jquery.tools.min.js" runat="server" /> 
<script type="text/javascript"> 
    function outputAMPM(d) { 
      var date = new Date(d); 
      h = d.getHours(); 
      if (h < 12) 
       return "AM"; 
      return "PM"; 
     } 
    $(document).ready(function() { 
     $("#calendar").fullCalendar({ 
      <% if (m_Year.HasValue){ %>year: <%= m_Year.Value %>,<%} %> 
      <% if (m_Month.HasValue){ %>month: <%= m_Month.Value - 1 %>,<%} %> 
      events: '<%= ResolveClientUrl(Request.AppRelativeCurrentExecutionFilePath) + (!String.IsNullOrEmpty(Request.QueryString.ToString()) ? "?" + Request.QueryString.ToString() : "") %>', 
      header: { 
       left: 'prev,next title', 
       center: '', 
       right: '' 
      }, 
      aspectRatio: 1.1, 
      titleLength: <%= TitleLength %>, 
      weekSelectURL: '<%= ResolveClientUrl("~/events.aspx") + m_DaylessQueryString + (!String.IsNullOrEmpty(m_DaylessQueryString) ? "&" : "?") %>', 
      weekMode: 'variable', 
      timeFormat: 'H(:mm)', 
      eventRender: function(event, element) { 
       element.append('<div class="eventPopup"><div class="popupWrapper"><span class="title">'+ event.title + '</span><span>' + $.format.date(event.start, "MM/dd/yyyy hh:mm") + outputAMPM(event.start) + '</span><span class="address">' + event.Address1+ '<br />' + event.Address2+ '<br />' + event.City + ', ' +event.State +' ' + event.Zip + '</span>' + '<a class="more" href="'+event.url +'">'+event.url +'</a><a class="more" href="all-events.aspx">View More</a><div class="clearfix"><div class="addthis_toolbox"><a class="addthis_button_facebook" addthis:url="'+ event.url +'" addthis:title="'+ event.title + '"></a><a class="addthis_button_tweet" tw:count="none"></a><a class="addthis_button_google_plusone" <%= "g:plusone:count=\"false\"" %>></a></div></div></div></div>'); 
      }, 
     eventAfterRender: function(event, element,view){ 
     setTimeout(function(){ 
     $('div.fc-event > a').tooltip().dynamic(); 
       $('div.fc-event').hover(function() { 
         $(this).addClass('hoveredEvent'); 
        }, 
        function() { 
         $(this).removeClass('hoveredEvent'); 
        } 
       ); 
     },1000); 
     } 
     }); 
     $(".fc-day-number").each(function(){ 
      var num = $(this).find("a").html(); 
      $(this).html(num); 
     }); 
    }); 
</script> 
<script type="text/javascript"> 

</script> 
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5098045873d5139d"></script> 
+0

Кто-нибудь? Что-то я думал о том, чтобы нажимать кнопки с помощью команд Javascript, но это не сработало: $ ('# calendar'). FullCalendar ('next'); $ ('# calendar'). FullCalendar ('prev'); Нужны предложения, пожалуйста. Я не понимаю, почему дни в календаре не меняются в первую очередь. – muybn

ответ

0

Я столкнулся с этой проблемой, когда использовал ее. Это произошло из-за кода, не написанного в $ (document) .ready (function() {}). Поскольку вы сделали это, попробуйте указать представление по умолчанию. к нему. Если возможно, создать http://www.jsfiddle.net

+0

Спасибо. Посредством некоторых проб и ошибок я обнаружил, что проблема заключается в функциях _eventAfterRender_ и _.fc-day-number_. Как только я прокомментировал это, дни были «интерактивными». Пожалуйста, расскажите мне, что делает jsfiddle и как ее использовать. Страница, которую я видел на сайте, мне показалась не очень понятной. – muybn

+0

уверен. Вы можете проверить это на http://css-tricks.com/seriously-just-make-a-jsfiddle/ – patz

Смежные вопросы