在JSF中bean方法完成后如何执行javascript函数

How to execute javascript function after bean method is finished in JSF

本文关键字:何执行 执行 函数 javascript JSF bean 方法      更新时间:2023-09-26

我想在相关动作被触发和相关bean方法完成后调用javascript函数。我在问题中看到了一些相关的东西-在ajax调用之后处理onclick函数,所以我使用f:ajax的onevent处理程序。

触发id为plnHiddenBtn的commandButton后,调用bean的"prepareTempPlan"方法。在"prepareTempPlan"的过程中,我可以看到数据是从DB中获取的,并且成功地由变量"specDates"包含,当"数据。status is "complete".

然而,"specDates"上的对象不能通过首次单击命令按钮从bean传递到客户端。第一次单击命令按钮后,刷新页面。当我第二次单击按钮时,我终于可以从bean中获得对象。我可以检查来自bean的对象是否传递了警告消息-在.js文件的"updateCalendar"方法中的alert(日期)。

我怎么能得到commandButton的动作被触发和相关的bean方法完成后的对象?

感谢所有的反馈!

名为. xhtml文件;

<input jsfc="h:commandButton" id="plnHiddenBtn" class="hiddenBtn"  action="#planCalendarFacade.prepareTempPlan}">
    <f:ajax execute="mainForm" onevent="updateAddedDayPlns" render="plnName" />
</input>
<h:inputHidden id="specDates" value="#{planCalendarFacade.specDates}"/>

. js文件;

function updateAddedDayPlns(data){
    var status = data.status; // Can be "begin", "complete" or "success".
    switch (status) {
        case "begin": // Before the ajax request is sent.
            alert("begin");
            break;
        case "complete": // After the ajax response is arrived.
            alert("complete");
            break;
        case "success": // After update of HTML DOM based on ajax response..
            alert("success");
            $('.addedDayPlnLst li:first').addClass('ui-selected');
            updateCalendar();  //<-THIS IS IMPORTANT->
            dayPlnInd = 0;
            break;
        }
}
function updateCalendar(){
    var dates = document.getElementById('mainForm:specDates').value;
    dates = JSON.parse(dates);
    alert(dates);
}

豆文件;

public class PlanCalendarFacade {
...
private Object specDates = new String("hello");
...
public void prepareTempPlan() {
    Plan plan = null;
    // Find the plan based on specific plan-id (slctdPlnId).
    for (int i = 0; i < plans.size(); i++)
        if ( plans.get(i).getPLAN_ID() == slctdPlnId )
            plan = plans.get(i);
    if (plan == null){
        // For "add user group" operation,
        tempPlan = new Plan();
        newRecFlag = false;
    }else{
        // For "update and delete user group" operations.
        tempPlan = plan;
        newRecFlag = true;
        getSpecificDayPlansFromDB(plan.getPLAN_ID());
        getAllDatesFromDB();
    }
}
编辑:

  • 我在等待你的建议,我对这个问题有很多了解!

您还需要render您的specDates字段,因此您的客户端变量从调用中得到更新。

<input jsfc="h:commandButton" id="plnHiddenBtn" class="hiddenBtn"  action="#planCalendarFacade.prepareTempPlan}">
    <f:ajax execute="mainForm" onevent="updateAddedDayPlns" render="specDates" /> //Also could render multiple fields, if needed...
</input>
<h:inputHidden id="specDates" value="#{planCalendarFacade.specDates}"/>