从javascript中获取托管bean的返回值

时间:2022-10-24 20:57:32

In my application I call a Javascript event which calls a p:remoteCommand named checkPageLayoutsAreSelected as following :

在我的应用程序中,我调用一个Javascript事件,该事件调用名为checkPageLayoutsAreSelected的p:remoteCommand,如下所示:

$('selector').on('click', function (e) {
  checkPageLayoutsAreSelected();
});

This is the p:remoteCommand :

这是p:remoteCommand:

<p:remoteCommand name="checkPageLayoutsAreSelected" actionListener="#{beanFormDashboard.checkPageLayoutsAreSelected}" />

This p:remoteCommand will call a method in the beanFormDashboard managed bean which will return a Boolean value :

这个p:remoteCommand将调用beanFormDashboard托管bean中的一个方法,该方法将返回一个布尔值:

public Boolean checkPageLayoutsAreSelected(){
    for(DashboardPage dp : dashboardPageList){
        if(dp.getModel() == 0){
            return false;
        }
    }
    return true;
}

So I want to get the returned value by the checkPageLayoutsAreSelected() from the managed bean in the Javascript code.

所以我想通过Javascript代码中托管bean的checkPageLayoutsAreSelected()获取返回值。

Something like this :

像这样的东西:

$('selector').on('click', function (e) {
  var returnedValue = checkPageLayoutsAreSelected();
});

How can I do that?

我怎样才能做到这一点?

2 个解决方案

#1


4  

checkPageLayoutsAreSelected doesn't return a value or even a promise but you can Ajaxicaly return value.

checkPageLayoutsAreSelected不返回值甚至是promise,但是您可以返回Ajaxicaly值。

<p:remoteCommand name="checkPageLayoutsAreSelected"
     action="#{beanFormDashboard.checkPageLayoutsAreSelected()}"
     oncomplete="getLayoutAreSelectedResult(xhr, status, args);"
/>

And in the method checkPageLayoutsAreSelected() you use RequestContext provided by PF to send result back to client:

在方法checkPageLayoutsAreSelected()中,您使用PF提供的RequestContext将结果发送回客户端:

public void checkPageLayoutsAreSelected() {
   Boolean result=true;
   for(DashboardPage dp : dashboardPageList){
        if(dp.getModel() == 0){
            result= false;
        }
   }
   RequestContext reqCtx = RequestContext.getCurrentInstance();        
   reqCtx.addCallbackParam("returnedValue", result);
}

And in the Javascript callback function getLayoutAreSelectedResult(xhr, status, args) you will have the returned value:

在Javascript回调函数getLayoutAreSelectedResult(xhr,status,args)中,您将获得返回值:

$('selector').on('click', function (e) {
    checkPageLayoutsAreSelected();
    window.getLayoutAreSelectedResult= function(xhr, status, args) {
       var returnedValue = args.returnedValue;
       console.log(returnedValue);
    }
});

#2


0  

The other answer works and gives u full xhr access, but you could theoretically do that at any point in time, throw something into the requestScope and re-render then pull it out from EL. Personally I prefer to have the elements visible on the page as we may use them later for any kind of info but this is another way to do it. Set a hidden element with reference to your bean data, and wrap it a component that can be targeted for re-rendering.

另一个答案是有效的并且给你完整的xhr访问权限,但理论上你可以在任何时间点执行此操作,将某些内容扔进requestScope并重新渲染然后从EL中取出。我个人更喜欢在页面上显示元素,因为我们可能会在以后使用它们获取任何类型的信息,但这是另一种方法。设置一个隐藏元素,引用您的bean数据,并将其包装一个可以作为重新呈现目标的组件。

Then in your checkPageLayoursAreSelected, set the value of that object on the bean, and have the remoteCommand render/update the component wrapper of your element, and an after effect then just use basic JS or Jquery to get the value from the dom.

然后在checkPageLayoursAreSelected中,在bean上设置该对象的值,让remoteCommand渲染/更新元素的组件包装器,然后使用基本的JS或Jquery从dom中获取值。

Working example:

工作范例:

view.xhtml

view.xhtml

  <button type="button" id="buttonClicker" class="buttonClicker" >Click Me</button>

  <p:remoteCommand name="checkPageLayoutsAreSelected" actionListener="#{testBean.checkPageLayoutsAreSelected}" update="pageLayoutSelected" oncomplete="showVal()"/>

  <h:panelGroup id="pageLayoutSelected">
       <h:inputHidden  value="#{testBean.pageLayoutSelected}" id="checkPageLayoutValueId" />
  </h:panelGroup>

  <script>
    $('.buttonClicker').on('click', function (e) {
         checkPageLayoutsAreSelected();
    });
    function showVal() {
        alert($("[id$='checkPageLayoutValueId']").val());
    };
  </script>

TestBean.java

TestBean.java

    private Boolean pageLayoutSelected;

    public Boolean checkPageLayoutsAreSelected(ActionEvent event) {
        if (pageLayoutSelected == null || pageLayoutSelected == Boolean.FALSE) {
            pageLayoutSelected = Boolean.TRUE;
        } else {
            pageLayoutSelected = Boolean.FALSE;
        }

    return pageLayoutSelected;
}
getters/setters

I've added an alert to show you that the data =has been modified.

我添加了一个警告,告诉您data =已被修改。

Important, you need to likely do it in the oncomplete phase - as it's absolutely sure that the dom rendering has beenc ompleted, onsuccess the DOM may still have the older value if the JS is run quick enough.

重要的是,你需要在完成阶段完成它 - 因为它绝对确定dom渲染已经完成,如果JS运行得足够快,那么获取DOM可能仍然具有较旧的值。

Hope this helps.

希望这可以帮助。

#1


4  

checkPageLayoutsAreSelected doesn't return a value or even a promise but you can Ajaxicaly return value.

checkPageLayoutsAreSelected不返回值甚至是promise,但是您可以返回Ajaxicaly值。

<p:remoteCommand name="checkPageLayoutsAreSelected"
     action="#{beanFormDashboard.checkPageLayoutsAreSelected()}"
     oncomplete="getLayoutAreSelectedResult(xhr, status, args);"
/>

And in the method checkPageLayoutsAreSelected() you use RequestContext provided by PF to send result back to client:

在方法checkPageLayoutsAreSelected()中,您使用PF提供的RequestContext将结果发送回客户端:

public void checkPageLayoutsAreSelected() {
   Boolean result=true;
   for(DashboardPage dp : dashboardPageList){
        if(dp.getModel() == 0){
            result= false;
        }
   }
   RequestContext reqCtx = RequestContext.getCurrentInstance();        
   reqCtx.addCallbackParam("returnedValue", result);
}

And in the Javascript callback function getLayoutAreSelectedResult(xhr, status, args) you will have the returned value:

在Javascript回调函数getLayoutAreSelectedResult(xhr,status,args)中,您将获得返回值:

$('selector').on('click', function (e) {
    checkPageLayoutsAreSelected();
    window.getLayoutAreSelectedResult= function(xhr, status, args) {
       var returnedValue = args.returnedValue;
       console.log(returnedValue);
    }
});

#2


0  

The other answer works and gives u full xhr access, but you could theoretically do that at any point in time, throw something into the requestScope and re-render then pull it out from EL. Personally I prefer to have the elements visible on the page as we may use them later for any kind of info but this is another way to do it. Set a hidden element with reference to your bean data, and wrap it a component that can be targeted for re-rendering.

另一个答案是有效的并且给你完整的xhr访问权限,但理论上你可以在任何时间点执行此操作,将某些内容扔进requestScope并重新渲染然后从EL中取出。我个人更喜欢在页面上显示元素,因为我们可能会在以后使用它们获取任何类型的信息,但这是另一种方法。设置一个隐藏元素,引用您的bean数据,并将其包装一个可以作为重新呈现目标的组件。

Then in your checkPageLayoursAreSelected, set the value of that object on the bean, and have the remoteCommand render/update the component wrapper of your element, and an after effect then just use basic JS or Jquery to get the value from the dom.

然后在checkPageLayoursAreSelected中,在bean上设置该对象的值,让remoteCommand渲染/更新元素的组件包装器,然后使用基本的JS或Jquery从dom中获取值。

Working example:

工作范例:

view.xhtml

view.xhtml

  <button type="button" id="buttonClicker" class="buttonClicker" >Click Me</button>

  <p:remoteCommand name="checkPageLayoutsAreSelected" actionListener="#{testBean.checkPageLayoutsAreSelected}" update="pageLayoutSelected" oncomplete="showVal()"/>

  <h:panelGroup id="pageLayoutSelected">
       <h:inputHidden  value="#{testBean.pageLayoutSelected}" id="checkPageLayoutValueId" />
  </h:panelGroup>

  <script>
    $('.buttonClicker').on('click', function (e) {
         checkPageLayoutsAreSelected();
    });
    function showVal() {
        alert($("[id$='checkPageLayoutValueId']").val());
    };
  </script>

TestBean.java

TestBean.java

    private Boolean pageLayoutSelected;

    public Boolean checkPageLayoutsAreSelected(ActionEvent event) {
        if (pageLayoutSelected == null || pageLayoutSelected == Boolean.FALSE) {
            pageLayoutSelected = Boolean.TRUE;
        } else {
            pageLayoutSelected = Boolean.FALSE;
        }

    return pageLayoutSelected;
}
getters/setters

I've added an alert to show you that the data =has been modified.

我添加了一个警告,告诉您data =已被修改。

Important, you need to likely do it in the oncomplete phase - as it's absolutely sure that the dom rendering has beenc ompleted, onsuccess the DOM may still have the older value if the JS is run quick enough.

重要的是,你需要在完成阶段完成它 - 因为它绝对确定dom渲染已经完成,如果JS运行得足够快,那么获取DOM可能仍然具有较旧的值。

Hope this helps.

希望这可以帮助。