JQuery Datepicker медленная загрузка в таблицу, IE7, приложение JSF

Question

У меня есть веб-приложение JSF, использующее jQuery datepicker в таблице. В таблице показан список документов, рядом с каждой документацией есть поле ввода даты, которое связывается с jQuery datepicker через id. Если я помещу скрипт jquery в самый верх файла xhtml, загрузка будет быстрой.

Проблема в том, что когда часть таблицы обновляется в ajax (мы использовали Icefaces 1.8.2), jQuery больше не может найти идентификатор поля ввода даты. То, что я называю ajax, это то, что у нас есть функция поиска по названию указанной документации, после того как поиск завершен, мы должны показать список результатов. Но список результатов, календарную дозу не показывают, я думаю, что jQuery потерял идентификаторы поля ввода списка, сгенерированные динмически.

Поэтому я поместил java-скрипт jQuery непосредственно перед полем ввода даты, после чего все заработало, то есть после поиска заголовка появился список результатов заголовка документации вместе с указателем даты.

Но проблема заключается в том, что загрузка страницы теперь запускается так медленно, что происходит более 30 секунд. Столов таблицы не так уж много, около 100 с чем-то. Ниже приведен код xhtml:

   <ice:dataTable var="pItem" value="#{someBackbean.somelist}"
             id="csList"

     <ice:column>
     <ice:panelGrid columns="3">

     <div>

<script type="text/javascript">     
    var jq=jQuery.noConflict();
    jq(document).ready(function(){
    //For id: The $= operator matches the end of the string and the id name mangling is always on the front.
    jq("[id$=fmv]").datepicker({
        showOn: 'button',
        buttonImage: '../../../jquery/images/calendar.gif',
        buttonText: 'Click to select a date', 
        buttonImageOnly: true,  
        duration: 'fast', 
        changeMonth: true,
        changeYear: true,
        dateFormat:'mm/dd/yy',
        yearRange: '-1:+1',
        showButtonPanel: true,
        closeText: 'Close',
        showWeek: true                      
        })
    });
         </script>

            <ice:inputText id="fmv"
                       size="10"
                       maxlength="10"
                       title="Date of Study"
                       value="#{pItem.dateOfStudy}"
                       validator="#{pItem.validate}"
                       name="fmv"
                       onchange="submit();"                  
                       valueChangeListener="#{pItem.dateChangeListener}"> 
               </ice:inputText>

           </div>  

           <ice:outputText style="color:red;cursor:pointer;"
                           title="Date is required to Print this Form" value="*"/>
           <ice:outputText value="#{pItem.label}" styleClass="nonLink"  />
           <ice:message for="fmv" styleClass="#{pItem.cssClass}" />               
        </ice:panelGrid>
     </ice:column>
  </ice:dataTable>

Answer 1

Похоже, вы создаете средство выбора даты для каждой строки, что будет действительно неэффективно. Было бы лучше создать кнопки отдельно, а затем делегировать обработчик щелчков в таблице для кнопок (потому что я думаю, вам не нужно иметь более одного средства выбора даты одновременно). Тогда вы можете использовать один выбор даты вместо 100. Это должно ускорить загрузку страницы.