【问题标题】:refresh datatable when close dialog without need to click on a button jsf2 primefaces关闭对话框时刷新数据表,无需单击按钮 jsf2 primefaces
【发布时间】:2012-08-18 19:36:18
【问题描述】:

我有这个对话框:

<p:dialog  header="Commande editée le #{acceuilUserController.selectedMajCommande.dateMaj} par l'#{acceuilUserController.selectedMajCommande.utilisateur.type} #{acceuilUserController.selectedMajCommande.utilisateur.nom} #{acceuilUserController.selectedMajCommande.utilisateur.prenom}" widgetVar="carDialog" resizable="false" id="carDlg"  
                     update="cars" showEffect="fade" hideEffect="explode" modal="true"> 

当用户点击数据表下方的按钮时显示:

<p:column style="width:40px">                         
                        <p:commandButton  id="selectButton" action="#{acceuilUserController.refresh()}" update=":form:carDlg" oncomplete="carDialog.show()" icon="ui-icon-search" title="plus de détails">  
                            <f:setPropertyActionListener value="#{car}" target="#{acceuilUserController.selectedMajCommande}" />  
                        </p:commandButton>                       
                    </p:column> 

我希望当用户关闭 tis 对话框时,会执行下面的方法:

public String refresh(){
    this.selectedMajCommande.setLu(true);
    System.out.println("je suis la alors : "+this.selectedMajCommande.isLu());
    hch.updateCommandeMaj(selectedMajCommande);
    return "acceuil";
}

它允许将数据刷新到数据表中,我成功地使用对话框中的一个按钮来实现这一点:

 <p:commandButton id="confirm" value="fermer" update="cars" oncomplete="carDialog.hide()"
                                     action="#{acceuilUserController.refresh()}" />

但我只想在关闭对话框时执行此操作,不需要框中的此按钮

这是我要刷新的数据表:

<p:dataTable id="cars" var="car" value="#{acceuilUserController.lc_maj}"  tableStyle="width:auto" rowStyleClass="#{(car.lu == false) ? 'red' : null}" >  

                    <p:column headerText="Commande N° : " style="width:100px">  
                        <h:outputText value="#{car.commande.id}" />  
                    </p:column>  

                    <p:column headerText="Date de mise à jour : " style="width:100px">  
                        <h:outputText value="#{car.dateMaj}" />  
                    </p:column> 

                    <p:column headerText="Decision : " style="width:100px">  
                        <h:outputText value="#{car.decison}" />  
                    </p:column> 

                    <p:column headerText="Etat : " style="width:100px">  
                        <h:outputText value="#{car.etat}" />  
                    </p:column> 

                    <p:column style="width:40px">                         
                        <p:commandButton  id="selectButton" action="#{acceuilUserController.refresh()}" update=":form:carDlg" oncomplete="carDialog.show()" icon="ui-icon-search" title="plus de détails">  
                            <f:setPropertyActionListener value="#{car}" target="#{acceuilUserController.selectedMajCommande}" />  
                        </p:commandButton>                       
                    </p:column> 

                </p:dataTable>        

如何实现,提前谢谢

【问题讨论】:

  • p:dialog 没有 update 属性。除此之外,PrimeFaces 更新组件的方法是在表单中使用p:ajax 来触发服务器端数据的更改。请向我们展示该组件。
  • 现在您添加了一些与问题无关的列。我们需要了解是什么事件触发了数据的变化。不然刷新的原因是什么?
  • 不是一个完整的解决方案,但您可以将 af:ajax 单击事件添加到对话框中的关闭命令按钮: 并更改 acceuilUserController.refresh(ActionEvent event)。
  • 我按照你说的添加这一行: (因为不支持 event='click')进入我的 ' 但它给我生成了这个错误: listener="#{acceuilUserController.refresh()}": Method refresh not found javax .el.MethodNotFoundException: /vues_utilisateur/acceuil.xhtml @51,124 listener="#{acceuilUserController.refresh()}": 找不到方法刷新
  • 抱歉,它可以工作,问题是我在 RequestScope 中有 managedBean,但现在我使用 ViewScoped 制作它,谢谢

标签: javascript dialog datatable primefaces refresh


【解决方案1】:

这可以使用 jQuery 来绑定单击事件,以这样的方式调用 PrimeFaces commandButton 组件的单击事件,该组件已配置为部分处理和更新您选择的组件。我做了类似的事情,把这个脚本放在一个复合组件中,放在我所有的对话框之外,但是当然有很多方法可以做到这一点。

jQuery(document).ready(function() {
    // Searching for naming container that contains my dialog...
    var dashboardPanel = jQuery('*[id*=#{cc.attrs.id}]');
    // Find the dialog closer button by its unique class
    var closerButton = dashboardPanel.children().find('.ui-dialog-titlebar-close');
    closerButtons.bind('click', function(event) {
        // Use set timeout to delay the event if you want to see close animation effect
        setTimeout(function() { //Some logic to find the button client id
            var menuItemId = 'view#{cc.attrs.id}'.replace('Panel', '');
            jQuery('#' + menuItemId).click();
        }, 400);
    });
});

当然,如果您没有带有动态 id 的 commandButton 或者它不在重复容器中,那么直接在 Javascript 中通过 widgetVar 引用它会简单得多。

commandButtonWidget.jq.click();

【讨论】:

    【解决方案2】:

    你应该像这样更新RequestContext

    public void update() {
       RequestContext requestContext = RequestContext.getCurrentInstance();
       requestContext.update("form:cars");
    }
    

    【讨论】:

      猜你喜欢
      • 2013-04-06
      • 2012-08-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-01-06
      相关资源
      最近更新 更多