logo标签列表

使用JavaScript发送Ajax请求到JSF

jqueryajaxjsfdraw2d
5

目前，我正在开发一个使用draw2d库绘制形状和图表的Web应用程序。在服务器端，我使用Java(JSF)。

我可以说，这个应用程序的95%都是纯JavaScript。我希望能够在我的JavaScript中发送Ajax请求，而不需要使用隐藏字段，例如<f:inputText>（也许使用jQuery Ajax组件？）。

我尝试通过添加不同的隐藏JFS组件和jsf.ajax.request来解决这个问题，但由于某些原因它们并不是非常可靠，有时候它们不会发送Ajax请求。

有什么建议吗？此外，关于jQuery，我不确定如何在服务器端处理请求。

答案：最终我使用了Dave建议的方法。我之前尝试使用来自链接的jsFunction，但是出现了错误。显然，问题在于Richfaces 4中还没有实现该功能。但是，如果您像Dave提到的那样使用，它可以完美地工作。

还有一点，Dave发布的bean对我没用。我必须按以下方式更改它： @ManagedBean(name = "jsFunctionBean") @SessionScoped public class JsFunctionBean {

/**
 * Test String name
 */
private String name;

public String getName() { return this.name; }
public void setName(String name) { this.name = name; }

/**
 * Test boolean
 */
private boolean test;
public boolean getTest() { return this.test; }
public void setTest(boolean test) { this.test = test; }    

/**
 * Action Method 
 * 
 * @return
 */
public String getActionMethod() {
    return null;
}

public String actionMethod(){
    this.test = true;
    this.name = "Dave";
    return null;
}
}

我不确定为什么会出现这种情况，但如果我删除getActionMethod或actionMenthod，就会出现错误！

这似乎是一个非常开放式的问题。如果您在实现JSF组件方面遇到具体问题，请展示您的问题，我们会尽力帮助您解决。如果您不了解如何使用JQuery AJAX，则应该阅读相关主题进行学习。 - maple_shaft
@maple_shaft：这个问题是开放式的，因为我正在尝试找到最佳解决方案，而且我非常困惑。也许这个问题的简化版本是：是否可以使用JQuery向我的bean发送ajax请求？如果可以，怎么做？我尝试了Google，但没有运气:( - Reza
@reza：你使用的JSF版本和实现是什么？ - Dave Maple
@Dave：jsf.ajax.request 是 JSF 2.0 规范的一部分。 - BalusC
很酷。如果您感兴趣，下面的Richfaces示例适用于在JSF 2.0上运行的Richfaces v4。 - Dave Maple
3个回答
6
如果您要使用第三方库Richfaces，a4j：jsFunction提供了通过javascript函数调用服务器端方法以及将对象序列化为json传递回回调函数的功能：
<h:form id="form1" prependId="false">

    <a4j:jsFunction 
        name="submitApplication"
        action="#{jsFunctionBean.actionMethod}"
        data="#{jsFunctionBean}"
        oncomplete="processData(event.data)" 
        immediate="true">
    </a4j:jsFunction>

    <script type="text/javascript">
        //example callback function
        function processData(data) {
            alert(data.test);
            alert(data.name);
        }

        //call the ajax method from javascript
        submitApplication();
    </script>

</h:form>

而你的Bean：

@ManagedBean(name = "jsFunctionBean")
@SessionScoped
public class JsFunctionBean {

    /**
     * Test String name
     */
    private String name;

    public String getName() { return this.name; }
    public void setName(String name) { this.name = name; }

    /**
     * Test boolean
     */
    private boolean test;
    public boolean getTest() { return this.test; }
    public void setTest(boolean test) { this.test = test; }    

    /**
     * Action Method 
     * 
     * @return
     */
    public String getActionMethod() {
        this.test = true;
        this.name = "Dave";
        return null;
    }


}
5

很遗憾，JSF JS API不支持这个功能。然而，这个增强功能已经在JSF spec issue 613中被要求。请随意为它投票。

目前最好的方法是使用一个不可见的表单，并通过编程提交来触发<f:ajax>。

例如，这个Facelet：

<h:form id="form" style="display:none;">
    <h:inputText id="input1" value="#{bean.input1}" />
    <h:inputText id="input2" value="#{bean.input2}" />
    <h:inputText id="input3" value="#{bean.input3}" />
    <h:commandButton value="submit" action="#{bean.submit}">
        <f:ajax execute="@form" />
    </h:commandButton>
</h:form>

使用jQuery可以轻松地完成此操作。
<script>
    $('#form\\:input1').val('value1');
    $('#form\\:input2').val('value2');
    $('#form\\:input3').val('value3');
    $('#form').submit();
</script>

还有这个托管的bean

private String input1;
private String input2;
private String input3;

public void submit() {
    // ...
}

// ...

###参见：

更新：现在已经过去5年，我个人已经实现了规范问题613，并添加了一个新的JSF组件<h:commandScript>。这主要基于OmniFaces <o:commandScript>。这将在即将推出的JSF 2.3中提供，目前已经作为里程碑版本发布。自2.3.0-m06以来，就可以使用<h:commandScript>组件。

谢谢您的帖子，但我之前尝试过这个方法，发现有两个问题：1-首先，我有很多需要使用ajax发送和接收数据的函数。对于所有这些函数都这样做似乎很难管理。其次，它存在一些bug（也许是我在实现过程中犯了错误），但现在我的某些事件随机失败了:( - Reza
你可以使用一个单一的字段，让JS填充一个JSON字符串，然后在后端bean中使用Gson或其他工具进行反序列化。同时，在JSON中传递操作标识符，以便JSF了解它必须调用哪个方法（例如使用命令模式）。 - BalusC
0
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接