toàn bộ lịch không hiển thị khi được tải (có đường trục)

Question

Tôi đang sử dụng plugin jQuery full calendar kết hợp với backbone.js và gặp sự cố khi không hiển thị đúng khi tải lần đầu tiên.

Đây là làm cho chức năng của tôi cho xem xương sống chứa lịch:

render: function() { 

    var that = this; 

    // DEBUG: 
    // console.log({entries: data}); 

    this.$el.html(this.template(this.serialize())); 

    this.$('#calendar').fullCalendar({ 
     header: { 
      left: 'prev,next today', 
      center: 'title', 
      right: 'month,agendaWeek,agendaDay' 
     }, 

     height: that.$el.parent().height() 
    }); 

      // prints undefined 
    console.log(this.$('#calendar').fullCalendar('getView').title); 

    window.setTimeout(function() { 
     this.$('#calendar').fullCalendar('changeView','agendaWeek'); 
    }, 500); 


    return this; 
} 

Bạn có thể thấy tôi có một thời gian chờ bộ cho 500 ms bao gồm. Khi tôi trì hoãn 500 ms đó, và sau đó thay đổi dạng xem thành agendaWeek, nó sẽ hiển thị. Tuy nhiên, nếu tôi không trì hoãn, lịch sẽ không hiển thị. Không có lỗi nào được in trong cả hai trường hợp.

Tôi đang mất điều gì cần thử ở đây hoặc những gì có thể xảy ra. Có một cuộc gọi lại để tạo lịch mà tôi đang thiếu ở đâu đó trong tài liệu không?

Cảm ơn

CHỈNH SỬA: có thể là .html() funciton chưa hoàn thành và gây ra sự cố?

Answer 1

Tôi đã có một vấn đề tương tự và tìm thấy thông tin này rất quan trọng trong các tài liệu:

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

lịch của tôi đã được trên một tab hiện không được chọn làm vùng chứa cha không nhìn thấy được và do đó không rút ra một cách chính xác. Đã thêm cuộc gọi vào phương thức hiển thị sau khi chọn tab và tất cả đều hoạt động tốt.

Sự cố của bạn có thể được giải quyết theo cách tương tự.

Answer 2

Tôi đang sử dụng backbone.js và tôi cũng gặp vấn đề tương tự.

Tôi đã khai báo và khởi tạo lịch trong sự kiện OnRender().

Sau đó để giải quyết vấn đề này, tôi đã chuyển mã để khai báo và khởi tạo lịch thành sự kiện OnShow().

Vấn đề:

Theo tôi vấn đề đó là vì đòi hỏi yếu tố đã không có mặt trên DOM. OnShow() bị kích hoạt khi DOM của bạn hoàn toàn sẵn sàng.

Cuối cùng, nó làm việc cho tôi.