除非我点击刷新,否则编辑记录的数据表链接只能工作一次

时间:2014-12-16 20:47:16

标签: jsf primefaces

使用Primefaces数据表和对话框。数据表中的每条记录都有一个链接:

     <p:commandLink value="#{item.pk}" update=":itemUpdateForm:display"
                    onclick="PF('itemUpdateDialog').show();" title="Edit">
            <f:setPropertyActionListener value="#{item}"
                        target="#{itemController.selecteditem}" />
     </p:commandLink>

该链接第一次成功打开了一个primefaces对话框,但是在我更新该记录集的弹出对话框中提交表单后,除非我在浏览器上点击刷新,否则数据表中的链接将不再打开对话框。 / p>

这是p:对话框中的更新按钮:

<f:facet name="footer">
    <p:commandButton value="Update" update=":ItemListForm:dataTable, :growl"
        oncomplete=" handleSubmitRequest(xhr, status, args, 'itemDlg','itemUpdateForm');"
        actionListener="#{itemController.doUpdateItem()}" />
    <p:commandButton type="reset" value="Reset"></p:commandButton>
</f:facet>

范围/相关代码:

itemController

@ManagedBean
@ViewScoped
public class ItemController implements Serializable {

@PostConstruct
public void init() {
    items= itemListProducer.getItems();
}

public void doUpdateItem() {
    itemRepository.update(selectedItem);
    itemEventSrc.fire(selectedItem);
    items = itemListProducer.getitems();
    Messages.addAjaxMessage("Update Operation Was Successful!");
}

列出制片人

@ApplicationScoped
public class ItemListProducer implements Serializable {

修改 每条评论都是DataTable和Primefaces更新对话框

<h:form id="ItemListForm">
    <p:dataTable id="dataTable" var="item"
        value="#{itemController.items}"
        paginator="true" rows="10"
        selection="#{itemController.selectedItems}" rowKey="#{item.oc_id}"
        paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
        lazy="false" rowsPerPageTemplate="10,15,50">

   <f:facet name="header"> 
       Items (#{itemController.items.size()}) 
   </f:facet>

   <p:column selectionMode="multiple" style="width:18px"/>

   <p:column filterBy="#{item.oc_id}" sortBy="#{item.oc_id}">
      <f:facet name="header"><h:outputText value="OC #" /></f:facet>

      <p:commandLink value="#{item.pk}" update=":itemUpdateForm:display" onclick="PF('itemUpdateDialog').show();" title="Edit">
      <f:setPropertyActionListener value="#{item}" target="#{itemController.selecteditem}" />
      </p:commandLink>
   </p:column>

   more p:columns

   <f:facet name="footer">
      <p:commandButton value="New item" onclick="PF('dlg1').show();" title="Creates new Item" />

      <p:commandButton value="Delete Selected Items" 
         actionListener="#{itemController.doDeleteItems}"
         update="@form, :growl">
        <p:confirm header="Confirmation" message="Are you sure you want to remove the selected Items?" />
      </p:commandButton>
  </f:facet>

</p:dataTable>
    <p:confirmDialog global="true">
        <p:commandButton value="Yes" type="button"
            styleClass="ui-confirmdialog-yes" icon="ui-icon-check" />
        <p:commandButton value="No" type="button"
            styleClass="ui-confirmdialog-no" icon="ui-icon-close" />
    </p:confirmDialog>

</h:form>

...和对话

<p:dialog header="Item Update Form" widgetVar="itemUpdateDialog" resizable="false" id="itemDlg">
   <h:form id="itemUpdateForm">
      <p:panel>
         <p:panelGrid id="display" columns="3" cellpadding="4"
                    style="margin:0 auto;">

                    <h:outputText value="Title :"></h:outputText>
                    <p:inputText id="title" value="#{itemController.selectedItem.title}"
                        required="true"
                        requiredMessage="Please Enter Title!" />
                    <p:message for="title" />
    other inputs

                    <f:facet name="footer">
                        <p:commandButton value="Update" update=":ItemListForm:dataTable, :growl"
                            oncomplete=" handleSubmitRequest(xhr, status, args, 'itemDlg','itemUpdateForm');"
                            actionListener="#{itemController.doUpdateItem()}" />
                        <p:commandButton type="reset" value="Reset"></p:commandButton>
                    </f:facet>
         </p:panelGrid>
      </p:panel>
   </h:form>
</p:dialog>

编辑2 感谢Michele's Answer的帮助,我确定这个问题与我如何通过id而不是widgetVar关闭对话框有关。我最初传入的是与jQuery效果'shake'一起使用的id,然后关闭该对象。通过添加widgetVar并使用Michele的var d = (typeof dialogWv === "string") ? PF(dialogWv) : dialogWv;我不再有我的问题。

这最终对我有用:

<p:dialog header="Update Form" widgetVar="itemUpdateDialogWv"
    resizable="false" id="itemUpdateDialogId">
      <h:form id="itemUpdateForm">
          <p:panel>
  ------content-------
                <f:facet name="footer">
                    <p:commandButton value="Update" update=":ItemListForm:dataTable, :growl"
                        oncomplete=" handleSubmitRequest(xhr, status, args, 'itemUpdateDialogWv','itemUpdateForm', 'itemUpdateDialogId');"
                        actionListener="#{itemController.doUpdateItem()}" />
                    <p:commandButton type="reset" value="Reset"></p:commandButton>
                </f:facet>
            </p:panelGrid>
            </p:panel>

      </h:form>
</p:dialog>


function handleSubmitRequest(xhr, status, args, dialogWv, formName, dialogNameId) {  
        dialog = jQuery('#'+dialogNameId);
        var d = (typeof dialogWv === "string") ? PF(dialogWv) : dialogWv;
    if(args.validationFailed) {  
        dialog.effect("shake", { times:5 }, 1000);  
    } else {
        clearForm(formName);
        d.hide();
    }  
}
function clearForm(formName){
    jQuery('#'+formName).each(function(){
        this.reset();
});
}

1 个答案:

答案 0 :(得分:1)

评论太长了......

您可以尝试:

<p:commandLink value="#{item.pk}" process="@this" update=":itemUpdateForm" 
    oncomplete="PF('itemUpdateDialog').show();" title="Edit">

    <f:setPropertyActionListener value="#{item}" target="#{itemController.selecteditem}" />
</p:commandLink>
  • 指定process="@this":否则默认为@all,也会包含对话框
  • 使用oncomplete代替onclick

<p:commandButton value="Update" process="@form" update="@form, :ItemListForm, :growl"
    oncomplete="handleSubmitRequest(xhr, status, args, 'itemDlg','itemUpdateForm');"
    actionListener="#{itemController.doUpdateItem}" />
  • 指定process="@form":与之前相同
  • @form添加到update:通常最好更新显示验证错误的对话框,并且只有在验证失败时关闭对话框(我不知道如何{{ 1}}工作,也许它确实如此)

然而:

  • commandButton上没有js错误点击?
  • 请求被解雇了吗?
  • 如果是,您是否可以针对无效点击发布请求参数?

P.S。

handleSubmitRequest有参数handleSubmitRequest(xhr, status, args, 'itemDlg','itemUpdateForm');。这是对的吗?

完整性在这里是我的itemDlg

hideDialog

被调用:

function hideDialog(dialog, args, status, xhr)
{
    var d = (typeof dialog === "string") ? PF(dialog) : dialog;

    if(!args.validationFailed)
    {
        d.hide();
    }
}