Добавление кнопки управления в р: заголовок графика

Question

Как добавить кнопку «обычай» в p:schedule? Я попытался сделать это с помощью графа заголовка, например, в компоненте p:dataTable, но безрезультатно.

---

К сожалению неясным изначально, это, вероятно, также не помогло, что кто-то зарезало мой вопрос, editting этого названия, здесь более подробно с фрагментами кода.

Я хочу сделать Somthing похожее на это:

    <p:tab title="#{bean.name}" value="bean" > 
         <f:facet name="title"> 
          <h:outputText value="#{bean.name}"/> 
          <p:selectBooleanButton styleClass="..."> 
           <p:ajax converter="... /> 
          </p:selectBooleanButton> 
         </f:facet> 
        </p:tab> 

код создает вкладку (за accordionpanel) с текстом + кнопки в нем, а не только текст по умолчанию.

Я ищу такое же поведение в компоненте p: schedule.

<p:schedule value="#{scheduleView.lazyEventModel}" leftHeaderTemplate="today" centerHeaderTemplate="prev, title, next" rightHeaderTemplate="month, agendaWeek" > 
     <f:facet name="header"> 
       <h:outputText value="#{bean.name}"/> 
       <p:commandButton styleClass="..."/> 
     </f:facet> 
</p:schedule> 

То же самое добавляет кнопка к принципу заголовка, за исключением этого времени по расписанию. И, разумеется, из-за того, что график не имеет никаких границ для перезаписи, этот подход не работает. Наконец, мой вопрос: как добавить кнопку в заголовок p: schedule, как на картинке выше?

P.S: Простите меня за то, что вы сбиваете с толку людей с помощью datatable, использовали его, потому что он поддерживает несколько граней (верхний, нижний колонтитул).

Answer 1

Клиентская сторона - это все html, с которыми можно манипулировать с помощью javascript (jquery, если хотите).

Так что, если вы создаете свой график и кнопки, как это:

<h:panelGroup id="mySchedule"> 
    <p:schedule value="#{scheduleView.lazyEventModel}" leftHeaderTemplate="today" centerHeaderTemplate="prev, title, next" rightHeaderTemplate="month, agendaWeek"/> 

    <h:outputText value="#{bean.name}" id="scheduleOutputText"/> 
    <p:commandButton styleClass="..." id="scheduleCommandButton"/> 

</h:panelGroup> 

Вы можете перемещать h:outputText и p:commandButton в соответствии с графиком jquery dom manipulation.

$("#scheduleCommandButton").insertBefore(".fc-left"); 
$("#scheduleOutputText").insertBefore("#scheduleCommandButton"); 

Если поместить этот скрипт внутри panelGroup и обновлять panelGroup каждый раз, когда вы обычно обновлять расписание с помощью AJAX, должны быть добавлены переместили кнопки и текст снова в обновлении.

<h:panelGroup id="mySchedule"> 
    <p:schedule value="#{scheduleView.lazyEventModel}" leftHeaderTemplate="today" centerHeaderTemplate="prev, title, next" rightHeaderTemplate="month, agendaWeek"/> 

    <h:outputText value="#{bean.name}" id="scheduleOutputText"/> 
    <p:commandButton styleClass="..." id="scheduleCommandButton"/> 

    $("#scheduleCommandButton").insertBefore(".fc-left"); 
    $("#scheduleOutputText").insertBefore("#scheduleCommandButton"); 

</h:panelGroup> 

Вы также можете поместить текст и кнопку в группу панелей и переместить их манипулятором dom. Просто убедитесь, что вы используете правильные селектора (я не добавлял идентификатор формы к указанным выше селекторам). Вы также можете использовать селектор классов вместо id. Это зависит от вас.

Но убедитесь, что вы используете это с осторожностью. Как отмечает @JasperDeVries в комментарии, легко сломать вещи. Используйте его как раз редко, тщательно и только в крайнем случае.