无法在ui组件的onclick属性中调用bean操作方法 [英] Can not invoke bean action method in onclick attribute of a ui component

问题描述

<h:outputLink value="/4JVA-157292-war/supinfo/auth/mycar.xhtml">Car</h:outputLink>
<h:outputLink value="Log Out" onclick="${loginController.logout()}" />

如您所见，如果我单击汽车"链接.我将执行${loginController.logout()}，但是如果我删除注销.我将进入汽车页面.

As you see, If i click the Car link. I will excute the ${loginController.logout()}, but if i delete the Log out. I will go into the car page.

推荐答案

<h:ouputLink> component is used to render plain a anchor element with its href attribute evaluated as value attribute of <h:outputLink> with the query parameters attached in case the component has <f:param> tags as its children.

<h:ouputLink> 未使用，因为您似乎错误地期望了执行服务器端的操作.您可能将它与 <h:commandLink> 组件，该组件用于通过JavaScript调用触发服务器端操作.

<h:ouputLink> is not used to execute server-side actions as you wrongly seemed to expect. You may have confused it with a <h:commandLink> component that is used to trigger a server-side action via a JavaScript call.

如果要调用操作方法，则必须切换到命令组件(或其派生类)，例如<h:commandLink>.其action属性应指向所需的操作方法，如下所示:

If you want to call the action method you must switch to a command comnponent (or its derivative) like <h:commandLink>. Its action attribute should point to the desired action method, like so:

<h:commandLink value="Log out" action="#{loginController.logout}" />

通过这种方式，您将能够执行bean操作方法.

In this way you will be able to execute the bean action method.

另外，值得注意的是，自JSF 2.0以来，已有一个<h:link>组件，可用于处理应用程序范围的导航.它在其outcome属性中获得导航用例结果，从而使<h:outputLink>组件可用于链接到外部资源.

Also it is worth noting that since JSF 2.0 there has been an <h:link> component that is useful for handling application-wide navigation. It takes a navigation case outcome in its outcome attribute thus leaving <h:outputLink> component useful for links to external resources.

有关此主题的更多信息，请阅读以下答案:何时应我使用h:outputLink而不是h:commandLink?.

For more information on the subject read the following answer: When should I use h:outputLink instead of h:commandLink?.

关于所遇到问题的原因，onclick属性呈现为生成的a元素的onclick事件处理程序，该事件处理程序响应所附加的HTML元素上的click事件.如果事件被触发，则会调用客户端JavaScript代码(通过函数调用onclick指向或通过执行其中包含的内联代码).请注意，onclick在客户端上运行(在Web浏览器中的JavaScript上下文中)，而action在服务器上运行(执行Java代码，具体取决于Web服务器中按下的提交按钮).

As to the cause of the problem you faced, onclick attribute is rendered as onclick event handler of the generated a element that responds to a click event on the HTML element it is attached to. In case the event is fired a client-side JavaScript code is called (by function call onclick points to or by executing inline code that is contained therein). Do note that onclick runs on the client (in JavaScript context within web browser) while action runs on the server (executes Java code depending on the submit button pressed within web server).

至少在以下情况下，onclick的使用可能会富有成果:

Usage of onclick may be fruitful at least in the following circumstances:

• 如果与命令组件一起使用，则如果未满足某些客户端要求(例如，可能会停止向服务器提交表单) 与元素关联的任何连续事件(如表单提交)之前，一旦触发事件，就会显示确认对话框并按下取消"按钮，否则客户端验证失败.

• in case it is used in conjunction with a command component it may stop form submission to the server if some client-side requirements are not met (i.e. confirm dialog was shown and cancel button was pressed, or client-side validation failed) as soon as the event will be fired before any consecutive events associated with the element (like form submission):

<h:commandLink value="Delete item" action="#{bean.delete(item)}" onclick="return confirm("Are you sure you want to delete this item?");" ... />

或

<h:commandLink value="Submit data" action="#{bean.action}" onclick="return inputValid();" ... />

使用

<script type="text/javascript">
    function inputValid() {
        var isInputValid = ...;
        //decide what's valid or not and set variable to true/false accordingly
        return isInputValid;
    }
</script>

它可用于触发某些GUI更改，尤其是与非命令组件结合使用时，例如:

it may be used to trigger some GUI changes, especially when used in conjunction with non-command components, like in:

<h:button value="Show dialog" onclick="showDialog(); return false;" ... />

这篇关于无法在ui组件的onclick属性中调用bean操作方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！