2013-09-20 9 views
0

Я пытаюсь сделать укладку на моем Jsf DataTable, как показано here:RichFaces 4: <rich:Jquery> Datatable Style Эффект, как в РФ витрина не работает в Scope View

Он работает в первый раз загрузки страницы. Но когда я делаю сортировку по столбцу с вызовом ajax (как поясняется в ссылке, показанной ранее), стилизация исчезает. Если я обновляюсь, стиль возвращается.

Если я поместил свою область в запрос scop. Стиль работает, но сортировка функций больше не работает. Вещь я не очень хорошо понимаю. (Заинтересованы в объяснении этих явлений ...)

Так что я понимаю, что jquery обеспокоен, но я не могу найти способ сказать: «эйи, не убирайте стили, когда я сортирую свои данные datatable»

Возможно, что-то связанное с reRender?

BalusC, любая идея? :)

Большое спасибо, ребята,

Иметь хороший день.

<h:form id="formSort" > 

<a4j:outputPanel id="ajaxOutputPanel" layout="block" ajaxRendered="true"> 

     <rich:dataTable id="customList" style="width:70%;margin-left:auto;margin-right:auto;" var="c" value="#{participant.listParticipant}" rendered="#{not empty participant.listParticipant}" 
       styleClass="stable" 
       rowClasses="order-table-odd-row,order-table-even-row"> 

      <f:facet name="header"><h:outputText value="PARTICIPANTS" /></f:facet> 

      <rich:column> 
       <f:facet name="header"> <h:outputText value="ID DE L'ETUDE" /></f:facet> 
       <h:outputText value="#{c.id_study}" /> 
      </rich:column> 

      <rich:column sortBy="#{c.enrollment_date}" id="enrollment_date" comparator="#{participant.dateComparator}" sortOrder="#{participant.dateOrder}"> 
       <f:facet name="header" > 
        <a4j:commandLink value="DATE D'INCLUSION" render="customList" action="#{participant.sortByDates}" /> 
       </f:facet> 
       <h:outputText value="#{c.enrollment_date}" /> 
      </rich:column> 

     </rich:dataTable> 


     </rich:panel> 

</a4j:outputPanel> 

</h:form> 

<rich:jQuery selector="#customList tr:odd" query="addClass('odd-row')" /> 
<rich:jQuery selector="#customList tr:even" query="addClass('even-row')" /> 
<rich:jQuery selector="#customList tr" query="mouseover(function(){jQuery(this).addClass('active-row')})"/> 
<rich:jQuery selector="#customList tr" query="mouseout(function(){jQuery(this).removeClass('active-row')})"/> 

ответ

1

Хорошо у меня есть что-то лучше делать это добавление прикрепить-Type = «живой» и тип события:

<rich:jQuery selector="#customList tr:odd" query="addClass('odd-row')" /> 
<rich:jQuery selector="#customList tr:even" query="addClass('even-row')" /> 

<rich:jQuery selector="#customList tr" event ="mouseover" query="jQuery(this).addClass('active-row')" attachType="live"/> 
<rich:jQuery selector="#customList tr" event ="mouseout" query="jQuery(this).removeClass('active-row')" attachType="live"/> 

Мой эффект работает для мыши над и мыши вне. Но стиль зебры все еще не работает. И я не могу повлиять на событие на двух первых богатых: тег запроса ... У меня здесь нет никакой идеи ... Кто-то, спасибо? продолжать искать решение ....

Стиля КССА:

.even-row {background-color: #FCFFFE;} 

.odd-row {background-color: #ECF3FE;} 

.active-row {background-color: #FFEBDA !important;cursor: pointer;} 

Другой вопрос, почему в богатых: DataTable, rowClasses установлен на «заказ-таблица нечетной строка, порядок стол -even-row ", тогда как мой css называется только odd-row и even-row. Я потерялся на этом ...

Обновление: я меняю css на order-table-even-row, order-table-odd-row ... и теперь evrything работает правильно.