primefaces scheduler in bootsfaces tabview

Question

Hi friends of programming,

I have a problem showing a primefaces schedule inside a bootsfaces tabview. The scheduler is not rendered and I do not know why.

I know that I have to activate lazyloading in the primefaces tabview, but it will be added in Bootsfaces 1.0.0.

Is there a workaround for my problem?

It is technically no problem for me to use the primefaces tabview, but the I have the same problem with the courseViewOptions, which is noch rendered.

CourseView.xhtml:

<ui:fragment xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:b="http://bootsfaces.net/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">

<h3>
    <h:outputText value="#{courseView.currentCourse.name}" />
</h3>

<b:tabView activeIndex="0"  ajax="false">
    <b:tab title="#{lang.course_overview}">
        <ui:include src="coursesViewOverview.xhtml" />
    </b:tab>
    <b:tab title="#{lang.course_grades}">
        <ui:include src="coursesViewGrades.xhtml" />
    </b:tab>
    <b:tab title="#{lang.course_calendar}">
        <ui:include src="coursesViewCalendar.xhtml" />
    </b:tab>
    <b:tab title="#{lang.course_tutorials}">
        <ui:include src="coursesViewTutorials.xhtml" />
    </b:tab>

    <b:tab title="#{lang.course_config}">
        <f:facet name="anchor">
            <b:iconAwesome name="cog" spin="true" />
        </f:facet>
        <ui:include src="coursesViewOptions.xhtml" />
    </b:tab>
</b:tabView>
</ui:fragment>

CourseViewCalendar.xhtml

<ui:fragment xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:b="http://bootsfaces.net/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">

<h:form>
    <p:growl id="messages" showDetail="true" />

    <b:panelGrid colSpans="12" columnClasses="value">
        <p:schedule id="schedule" value="#{calendarView.eventModel}"
            widgetVar="myschedule" timeZone="GMT+2">

            <p:ajax event="dateSelect" listener="#{calendarView.onDateSelect}"
                update="eventDetails" oncomplete="PF('eventDialog').show();" />
            <p:ajax event="eventSelect" listener="#{calendarView.onEventSelect}"
                update="eventDetails" oncomplete="PF('eventDialog').show();" />
            <p:ajax event="eventMove" listener="#{calendarView.onEventMove}"
                update="messages" />
            <p:ajax event="eventResize" listener="#{calendarView.onEventResize}"
                update="messages" />

        </p:schedule>
    </b:panelGrid>

    <p:dialog widgetVar="eventDialog" header="#{lang.event_details}"
        showEffect="clip" hideEffect="clip">
        <h:panelGrid id="eventDetails" columns="2">
            <p:outputLabel for="eventTitle" value="#{lang.event_name}" />
            <p:inputText id="eventTitle" value="#{calendarView.event.title}"
                required="true" />

            <p:outputLabel for="eventDescription"
                value="#{lang.event_description}" />
            <p:inputTextarea id="eventDescription"
                value="#{calendarView.event.description}" required="true" />

            <p:outputLabel for="eventFrom" value="#{lang.event_from}" />
            <p:calendar id="eventFrom" value="#{calendarView.event.startDate}"
                timeZone="GMT+2" pattern="dd/MM/yyyy HH:mm" />

            <p:outputLabel for="eventTo" value="#{lang.event_to}" />
            <p:calendar id="eventTo" value="#{calendarView.event.endDate}"
                timeZone="GMT+2" pattern="dd/MM/yyyy HH:mm" />

            <p:outputLabel for="eventAllDay" value="#{lang.event_all_day}" />
            <h:selectBooleanCheckbox id="eventAllDay"
                value="#{calendarView.event.allDay}" />

            <p:outputLabel for="searchPeople" value="#{lang.event_searchPeople}" />
            <ui:include src="/secured/fragment_search.xhtml" />

            <p:commandButton type="resetEventButton" value="#{lang.event_reset}" />
            <p:commandButton id="addEventButton" value="#{lang.event_save}"
                actionListener="#{calendarView.addEvent}"
                oncomplete="PF('myschedule').update();PF('eventDialog').hide();" />
        </h:panelGrid>
    </p:dialog>
</h:form>
</ui:fragment>

CourseViewOptions.xhtml

<ui:fragment xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:b="http://bootsfaces.net/ui" xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core">

    <ui:include src="changePermission.xhtml" />

    <b:listLinks>
        <b:navLink href="#changePermission" value="Todo Rechte ändern"
            iconAlign="left" iconAwesome="plus-circle" data-toggle="modal"
            data-target="#changePermission"
            onclick="$('#changePermission').modal();return false;" />
    </b:listLinks>


</ui:fragment>

Thank you for your help and happy coding. Marcel

EDIT: Firebug shows me the following:

<div class="row">
    <div class="col-lg-12 value">
        <div id="j_idt71:schedule">
            <div id="j_idt71:schedule_container"></div>
            <input id="j_idt71:schedule_view" type="hidden" value="month" autocomplete="off" name="j_idt71:schedule_view">
        </div>
    </div>
</div>

The schedule_container is empty. I dont know why.