个人中心
gpt4 book ai didi

jquery - jquery 与 jsf 集成

转载 作者：行者123 更新时间：2023-12-01 07:22:08 25 4
gpt4 key购买 nike

当我有一个带有 jQ​​uery 的 JSP 页面时，执行该页面没有任何问题。当我在带有 JSF 的 Facelets 页面中使用相同的代码时，jQuery 似乎不起作用。它无法识别 id <input> 的属性标签。以下是Facelets页面的代码。 

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich">

  <style type="text/css">
    h1 {
      font-family: "Times New Roman";
      font-size: 7px;
    }

    pre {
      font-family: "Times New Roman";
      font-size: 25px;
      font-style: bold;
      align: center;
    }
</style>
<script LANGUAGE="JavaScript" SRC="jquery-1.7.min.js"></script>
<script type="text/javascript">
    window.onload = function(e) {
        var counter = 1
        $("#description").blur(function() {
            $.post("newForm.do", {
                alert('inside description')
                name : $("#name").val(),
                description : this.value
            }, function() {

            });
        });

        $("#addQuestion")
                .click(
                        function() {
                            alert('inside addquestion')
                            var question = '<div id="question'+counter+'">Question : <input type="text" name="questionText" value=""/>Answer Type : <input type="text" name="answerType" value=""/><input type="button" name="save" value="Save"/></div>'
                            $("#wrapper").append(question)
                            // only at this point, save button is created
                            $("input[name=save]").click(function(){
                                $.post("addQuestion.do", {
                                    questionText : $(this).siblings("input[name=questionText]").get(0).value ,
                                    answerType : $(this).siblings("input[name=answerType]").get(0).value
                                    }, function() {

                                    });
                            });
                            counter++
                        }

                )

        $("#submit").click(
                function() {    
                    $.post("submitForm.do") 
                });
    }

</script>
</h:head>
<h:body>
    <h:form>

<p:layoutUnit position="center" style="border-width:0px;">
                <h1>
                    <font size="6">
                    <h:outputLabel for="createform"
                            value="Create New Form" /></font>
                </h1>
                <hr width="98%"></hr>
                <table>

                    <tr>
                        <td width="30%"><pre>
                                <h:outputLabel for="name" value="Name of the form : " />
                        </pre></td>
                        <td align="left">
                <input type="text" id="name" value="" />
                        </td>
                    </tr>
                    <tr>
                        <td width="30%"><pre>
                            <h:outputLabel for="desc" value="Description of the form : " />
                            </pre></td>
                        <td align="left">
                    <input type="text" id="description" value="" /> 
                        </td>
                    </tr>

                    <tr>
                    <td></td>
                            <td> 
                            <div id="wrapper"></div>
                             <input type="button" id="addQuestion" value="Add New Question" />
                             <input type="button" id="submit" value="Submit" />
                            </td>
                    </tr>
                </table>
            </p:layoutUnit>
        </p:layout>

    </h:form>
</h:body>

</html>

最佳答案

JSF 和 jQuery 库集成的示例位于以下链接中: JSF Bootstrap Jquery Integration

以下是需要注意的点:

  • 您必须添加以下标记才能支持 JSF 2.2 中的 HTML ( <html ... xmlns:jsf="http://xmlns.jcp.org/jsf" ) 有关详细信息: HTML5-Friendly Markup

  • 在以下标记之间写入 jQuery 方法的定义:

    //<![CDATA[
    $(document).ready(function() { });<br/>
    //]]>

关于jquery - jquery 与 jsf 集成，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12604676/

25 4 0
文章推荐： jquery - 循环更改图像不起作用
文章推荐： WPF 和 Powershell - 处理事件
文章推荐： oop - 我应该指定 setter 吗？
文章推荐： 不相关集合的 hibernate 映射问题
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com