2011-01-11 3 views
2

Я ударил стену. Я хорошо знаком с a4j и яркими тегами (я использую Seam 2.2.0 и Richfaces 3.3.1). Тем не менее, я пытаюсь сделать что-то очень простое, но в богатом: modalPanel.a4j: поддержка в богатых: modalPanel

Кажется, что rich: modalPanels не позволяют запускать события Ajax. Вот простая разбивка: У меня есть h: selectOneMenu с некоторыми элементами в нем и значение которого привязано к бэк-файлу. Прикрепленный к этому h: selectOneMenu - это тег поддержки a4j: support, так что всякий раз, когда происходит событие изменения, бэк-файл должен обновляться. Действительно простой материал?

Однако, когда этот h: selectOneMenu находится в богатом: modalPanel, событие onchange не обновляет бэк-файл до тех пор, пока богатый: modalPanel не закроется.

Я могу подтвердить это, потому что я запускаю его в режиме отладки Eclipse, и у меня есть точка останова на настройщике свойства, которое подключено к h: selectOneMenu. Это сводит меня с ума! Это ванильный материал для Ajax, но богатый: modalPanels, похоже, не позволяют этого.

Итак, вопрос: могу ли я сделать материал Ajax в богатых: modalPanel? Я в основном пытаюсь использовать rich: modalPanel как форму (я пробовал a4j: form и h: form безрезультатно), который реагирует на изменения в раскрывающемся списке (например, когда пользователь меняет выпадающее значение, определенный часть формы должна быть восстановлена). Я пытаюсь сделать что-то, что невозможно?

Вот упрощенная версия modalPanel:

<rich:modalPanel id="quickAddPanel"> 
    <div> 
     <a4j:form id="quickAddPaymentForm" ajaxSubmit="true"> 
       <s:decorate id="paymentTypeDecorator"> 
        <a4j:region> 
         <h:selectOneMenu 
          id="paymentType" 
          required="true" 
          value="#{backingBean.paymentType}" 
          tabindex="1"> 
          <s:selectItems 
           label="#{type.description}" 
           noSelectionLabel="Please select..." 
           value="#{incomingPaymentTypes}" 
           var="type"/> 
          <s:convertEnum/> 
          <a4j:support 
           ajaxSingle="true" 
           event="onchange" 
           eventsQueue="paymentQueue" 
           immediate="true" 
           limitToList="true" 
           reRender="paymentTypeDecorator, paymentDetailsOutputPanel, quickAddPaymentForm"/> 
         </h:selectOneMenu> 
        </a4j:region> 
       </s:decorate> 
      </fieldset> 

      <fieldset class="standard-form"> 
       <div class="form-title">Payment details</div> 
       <a4j:outputPanel id="paymentDetailsOutputPanel"> 
        <h:outputText value="This should change whenever dropdown changes: #{backingBean.paymentType}"/> 
       </a4j:outputPanel> 
      </fieldset> 
     </a4j:form> 
    </div> 
</rich:modalPanel> 

С уважением, Энди

+0

- любое действие, вызванное a4j: поддержка события обмена? Если да, то вы подтвердили, что действие вызвано? – niksvp

+0

Нет. Это простая привязка a4j: support event = 'onchange', которая гарантирует, что когда выпадающее меню изменится, значение bean bean-компонента, которое оно обязательно получит, будет обновлено. И он обновляется, но только после закрытия модальной панели. Если это не было в модульной панели, обновление компонента будет происходить каждый раз, когда значение сбрасывается. –

+0

Модальная панель с формой (h или a4j) внутри должна работать. Ах, и не забывайте переписывать его. Отредактируйте и разместите свой модальный код, чтобы мы могли помочь вам лучше. – Renan

ответ

1

Он должен работать. Проверьте с помощью a4j: журнал, что обновленная разметка (которую вы повторно визуализируете) отправляется с сервера. Я не верю, что это вызывает проблему, но вы можете изменить несколько вещей в своем коде:

ajaxSubmit = true - вам это действительно не нужно, поскольку вы используете a4j: support ajaxSingle = true и a4j: region - то же самое в вашем случае limitToList = true - вам это не нужно, так как вы не обновляете какие-либо другие области на странице.

+0

Исправлено! Удалено limitList, немедленное и ajaxSingle из h: selectOneMenu a4j: тег поддержки и voila, мои приложения ajax работают! Спасибо за головы! Очень признателен. –

0

Попробуйте принимать форму за пределами вашего modalPanel тега:

<a4j:form id="quickAddPaymentForm" ajaxSubmit="true"> 
    <rich:modalPanel id="quickAddPanel"> 
     <div> 

также убедитесь, что ваш "quickAddPaymentForm" не вложен

3

использование <h:form>

и удалите следующие атрибуты из: ajaxSingle = "истинный ", instant =" true "

0

Проверьте параметры HTML, сгенерированные f: selectItems или s: selectItems не содержат конечных пробелов (vie ж исходный код страницы из браузера):

<select> 
    <option value="0 ">Select One </option> 
    <option value="id1 ">Choice 1 </option> 
    <option value="id2 ">Choice 2 </option> 
    <option value="id3 ">Choice 3 </option> 
</select> 

Если это так, удалите замыкающие пробелы в стороне сервера код,

<select> 
    <option value="0">Select One</option> 
    <option value="id1">Choice 1</option> 
    <option value="id2">Choice 2</option> 
    <option value="id3">Choice 3</option> 
</select> 

я обнаружил, что замыкающие пробелы предотвратить Ajax события от стрельбы, когда a4j: поддержка и h: selectOneMenu работает внутри богатого: modalPanel, хотя он отлично работает за пределами богатых: modalPanel.Вот пример рабочего кода:

<h:form> 
<rich:modalPanel id="myPanel" autosized="true" width="700" showWhenRendered="true"> 
    <table cellpadding="4" cellspacing="2" align="center" width="100%"> 
    <tr> 
    <td align="left"> 
     <h:selectOneMenu styleClass="dropdown" id="dropdownList" 
      value="#{backbean.currentChoice}" 
      valueChangeListener="#{backbean.choiceChanged}" > 
      <f:selectItems value="#{backbean.choiceItems}"></f:selectItems> 
      <a4j:support event="onchange" reRender="whatPicked" ajaxSingle="true" /> 
      </h:selectOneMenu> 
     </td> 
    </tr> 
    <tr> 
     <td> 
     <a4j:outputPanel id="whatPicked"> 
      <h:outputText value="#{backbean.currentChoice }"></h:outputText> 
     </a4j:outputPanel> 
     </td> 
    </tr> 
    </table> 
</rich:modalPanel> 
</h:form>