2017-08-16 118 views
1

我有一个后端restservice通话值,返回值,与我有执行JS功能(为简单起见,我把“警戒”在这里,在前端。这必须是在JSF实现的,我有一个困难时期。执行JS功能与@ManagedBean

而且,这是捕获,性能方面的原因,我想后端其余-致电第一要上点击执行。

这里是(以及许多其他事情),我曾尝试过:

<p:commandLink action="#{viewingSessionBean.prepareViewingSession(document)}" oncomplete="alert('#{viewingSessionBean.name(document)}')"> 
    <p:graphicImage value="documentViewerPopup.png"/> 
</p:commandLink> 

这里的豆(缩短,使指向更清晰):

@ManagedBean 
@ViewScoped 
public class ViewingSessionBean implements Serializable { 
    private String name; 

    public String prepareViewingSession(Document document) { 
      name = restClient.call() 
      hashMap.put(document.getBlobId(), name); 
      return null; // don't navigate away... 
    } 

    public String name(Document document) { 
     return hashMap.get(document.getBlobId()); // return null if nothing is cached for the document yet there 
    } 

} 

我想这样做(伪代码......没有H:commandScript ...,太旧JSF,没办法升级)

<h:commandScript action="alert('#{viewingSessionBean.prepareViewingSession(document)}') /> 

回答

1

完成这件事有点棘手,但仍然可行。

有一件事你必须记住第一:你在写.xhtml的JavaScript代码在一个“静”的方式呈现。但是,什么意思是“静态”?这意味着如果您在JavaScript代码中引用了一个bean变量,然后在您的bean中更新这个变量值,那么您打印的JavaScript代码将无法看到您刚刚做出的这些更改。在这种情况下,您必须首先更新您的JavaScript代码(使用ajax)以获取变量中的更改,然后才能执行它。

让我们先从你的bean:现在

@ManagedBean 
@ViewScoped 
public class ViewingSessionBean implements Serializable { 

    private String variable; 

    public String getVariable() { 
     return this.variable; 
    } 

    public void updateVariableValue(Document document) { 
      variable = restClient.call(); 
    } 

} 

,将.xhtml代码:

<h:form id="form"> 
    <p:commandLink id="firstLink" 
        actionListener="#{viewSessionBean.updateVariableValue(document)}" 
        update=":form:secondLink" 
        oncomplete="$('#form\\:secondLink').click()"/> 
    <p:commandLink id="secondLink" onclick="alert('#{viewSessionBean.variable}')" style="display: none;"/> 
</h:form> 

注意的几件事情:

第一:它使用了两个commandLinks,而不是只有一个,为什么?因为在第一个链接的不完全调用时,bean变量已经是最新的,但是你的html代码不是。因此,为了获得bean变量的更新值,我们执行以下操作:

  • 调用actionListener更新bean上的变量值;
  • 在第二个链接上创建ajax更新以从bean获取更新的值;
  • 调用oncomplete方法并调用点击第二个链接(现在更新为正确的值);

第二:要调用第二个链接的点击,我们必须跳过jQuery调用中的两个点。

三:第二个环节设置与显示:无风格,使其在屏幕上不可见。

现在只是关于它的一些想法:JSF效果很好旁边的JavaScript,但是有时候我们必须做出一些拙劣的手法像这样完成的“易”的任务。我并不是说JSF是不好的,但我认为我们可以对这些事情采取更“开箱即用”的方法。只是我的意见。

+0

真棒的想法/模式!我认为,在“firstLink”中的oncomplete事件中,你想触发$('#form \\:secondLink')。click(),是否正确? – Frischling

+0

真实生活的另一个改进是使用#{component.findComponent('secondLink')。clientId}进行选择,这样可以更轻松地在实际情况下阅读代码,并且在其中堆叠maaaany div等进入彼此。这导致 Frischling

+0

@Frischling是的,第一个链接应该调用第二个链接点击,更新我的答案。你也是对的jQuery选择功能,我省略了它,以尽可能简单的答案。谢谢你们的高举,虽然;) – Bonifacio