Question

问题：
i）在JSF2应用程序中，我想创建一个带有选项卡控件的页面，当用户单击选项卡时，下面面板的内容通过ajax调用从服务器中的xhtml文件加载。 /> ii）我希望这支持优雅降级（当Javascript被禁用时），以便在单击选项卡时，触发HTTP请求，并加载新页面......或者反过来，通过渐进增强。

部分解决方案： i）我想我可以通过BalusC在How to ajax jsf 2 outputLink发布的代码示例来实现这一点： -

<h:form>
<f:ajax render=":include">
    <h:commandLink value="Home" action="#{menuManager.setPage('home')}" /><br />
    <h:commandLink value="FAQ" action="#{menuManager.setPage('faq')}" /><br />
    <h:commandLink value="Contact" action="#{menuManager.setPage('contact')}" /><br />
</f:ajax>

</h:form>
<h:panelGroup id="include">
    <ui:include src="#{menuManager.page}.xhtml" />
</h:panelGroup>

问题
如何扩展这个以解决问题（ii）或者还有其他完全不同的方法吗？我想也许我可以通过noscript实现这一点，但无法弄清楚如何！

编辑：可能的解决方案 - 尚未验证：
即使ajax被禁用，上述代码也应该有效;根据{{3}} :)，它应该只通过HTTP工作优雅！我会尝试一下。

Answer 1

如果您使用<h:commandButton>而不是<h:commandLink>，那么在禁用JS时它会正常工作。无论如何，命令链接需要JS以提交“隐藏”的POST表单，ajaxified或notjaxified。如果有必要，您可以使用一些CSS来使命令按钮看起来像链接（例如删除边框，背景，插图等）。

作为一种完全不同的替代方案，无论如何都要使用<h:outputLink>或<h:link>将页面作为请求参数或pathinfo，并使用jQuery.load()代替不引人注意地获取包含页面，提取相关部分并包含在HTML DOM树中。

当Javascript被禁用时，Ajax回退

1 个答案: