JSF 2.0 AJAX:使用jsf.ajax.request(或其他方法)从javascript调用bean方法

前端之家收集整理的这篇文章主要介绍了JSF 2.0 AJAX:使用jsf.ajax.request(或其他方法)从javascript调用bean方法前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
一些背景:我正在构建一个自定义的JSF组件.该组件基本上是一个文本编辑器,它应该有一个“保存”按钮来保存编辑器的内容字符串.当我使用 CodeMirror库时,我需要使用javascript从编辑器中获取内容(字符串),并将其发送到服务器.因此,在这种情况下,我不能使用基于XML的JS调用,如f:ajax.

问题:我打算用jsf.ajax.request发送字符串,但是它并不直接支持调用bean的方法.如何使用JSF以AJAX的方式调用bean中的方法

至少有两种方法可以解决这个问题:

>将隐藏的表单包含到具有隐藏的输入域的页面中.从javascript更新该输入框,然后调用jsf.ajax.request来发布该表单.如果需要,可以在属性的getter或setter中调用自定义操作.
>使用原始的XMLHttpRequest(或者可能还有其他JS库的帮助)执行请求.创建一个servlet并调用它.

这两种方式都是笨拙的,后者也突破了JSF范围.

我错过了什么吗?你怎么做这些

有一个quite similar question,但答案只提到基于XML的AJAX调用.还有another similar question,但也指的是基于XML的AJAX调用.

我无法找到如何使用javascript直接调用bean,但是这里是一个黑客,从javascript调用f:ajax-declaration:

1)为要发送到服务器的所有数据创建一个带有字段的隐藏表单.还包括一个h:commandButton:

<h:form id="hiddenForm" style="display: none;">
    <h:inputHidden id="someData" value="#{someBean.someData}" />
    <h:commandButton id="invisibleClickTarget">
        <f:ajax execute="@form" listener="#{someBean.myCoolActionOnServer()}" />
    </h:commandButton>
</h:form>

在这种情况下,通常情况下,侦听器属性#{someBean.myCoolActionOnServer()}是指要在服务器上执行的方法.

2)在其他一些按钮中,使用onclick来调用你的特殊javascript并通过javascript点击触发器按钮:

<h:commandButton value="Click me" onclick="populateTheForm('hiddenForm'); document.getElementById('hiddenForm:invisibleClickTarget').click(); return false;" />

populateTheForm()实际上应该将数据填充到hiddenForm的字段中.

这是我案件的简化,但应该有效.尽管如此,仍然寻找更加温和的做法.

猜你在找的Ajax相关文章