几个小时以来,我一直在努力地努力,以使tagmanager.js在我的JSF 2.2页面上工作,现在我希望能获得一些帮助。我使用jsp页面可以正常工作,但这些页面已过时且已弃用。我可以很好地输入标签,但是当我提交表单时,标签文本不会将其放入我的Java bean中。标题,说明和YouTube URL确实将其放入bean。根据tagmanager网站,它应该按照我设置的方式工作。我输入的标签应该进入名为“ j_idt16:hiddenTags”的隐藏输入中

链接到tagmanager:http://welldonethings.com/tags/manager/v3

这是我的网页代码“ requestimp.xhtml”

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<h:html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://xmlns.jcp.org/jsf/passthrough">


<h:body>
<ui:composition template="/WEB-INF/templates/DefaultTemplate.xhtml">
<ui:define name="content">

    <h:outputScript library="js/jquery" name="jquery-1.10.2.min.js"/>
    <h:outputScript library="js/tagmanager" name="tagmanager.js"/>

    <f:verbatim>
        <script type="text/javascript">
        function start()
        {
            jQuery(".tm-input").tagsManager({
                prefilled: null,
                CapitalizeFirstLetter: false,
                AjaxPush: null,
                AjaxPushAllTags: null,
                AjaxPushParameters: null,
                delimiters: [44, 9, 13], // comma, tab, enter
                backspace: [8],
                maxTags: 6,
                replace: true,
                output: null,
                tagsContainer: null,
                tagCloseIcon: 'x',
                tagClass: '',
                hiddenTagListId: 'j_idt16:hiddenTags',
                hiddenTagListName: null,
                validator: null,
                onlyTagList: false
            });
        };

        window.onload=function(){start();};
        </script>
    </f:verbatim>

    <h:outputStylesheet library="css" name="tagmanager.css"/>
    <h1 class="codeimps-form-h1">Make A Request!</h1>
    <h:form>
        <h:inputHidden id="hiddenTags" value="#{requestBean.tags}"/>
        <h:panelGrid columns="3">
            <h:outputText value="Title" styleClass="codeimps-form-description"></h:outputText>
            <h:inputText id="input_Title" value="#{requestBean.title}" size="32" required="true"></h:inputText>
            <h:message for="input_Title"></h:message>

            <h:outputText value="Description" styleClass="codeimps-form-description"></h:outputText>
            <h:inputTextarea id="input_Description" value="#{requestBean.description}" rows="5" cols="28" p:maxlength="140" required="true"></h:inputTextarea>
            <h:message for="input_Description"></h:message>

            <h:outputText value="YouTube URL" styleClass="codeimps-form-description"></h:outputText>
            <h:inputText id="input_YouTubeURL" value="#{requestBean.youtubeURL}" size="50" p:placeholder="video is worth a thousand words...">
            <f:validator validatorId="YouTubeURLValidator"/>
            </h:inputText>
            <h:message for="input_YouTubeURL"></h:message>

            <h:outputText value="Tags" styleClass="codeimps-form-description"></h:outputText>
            <h:inputText id="input_Tags" size="32" p:autocomplete="off" p:placeholder="enter a tag" p:class="input-medium tm-input tm-input-info" p:data-original-title=""></h:inputText>
            <h:message for="secret_Tags"></h:message>
        </h:panelGrid>
        <h:commandButton value="submit" action="#{requestBean.submit}"></h:commandButton>
    </h:form>
</ui:define>
</ui:composition>
</h:body>
</h:html>


这是加载表单时我网站的渲染输出:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<head id="j_idt2">
  <title>codeimps.com</title><link type="text/css" rel="stylesheet" href="/codeimps/faces/javax.faces.resource/codeimps.css?ln=css" /><link type="text/css" rel="stylesheet" href="/codeimps/faces/javax.faces.resource/tagmanager.css?ln=css" />    </head><body>

<div id="header">
         <h1 class="codeimps-impact codeimps-impact-h1">codeimps - real working examples</h1>
</div>


<div id="content"><script type="text/javascript" src="/codeimps/faces/javax.faces.resource/jquery-1.10.2.min.js?ln=js/jquery"></script>    <script type="text/javascript" src="/codeimps/faces/javax.faces.resource/tagmanager.js?ln=js/tagmanager"></script>
            <script type="text/javascript">
            function start()
            {
                jQuery(".tm-input").tagsManager({
                prefilled: null,
                CapitalizeFirstLetter: false,
                AjaxPush: null,
                AjaxPushAllTags: null,
                AjaxPushParameters: null,
                delimiters: [44, 9, 13], // comma, tab, enter
                backspace: [8],
                maxTags: 6,
                replace: true,
                output: null,
                tagsContainer: null,
                tagCloseIcon: 'x',
                tagClass: '',
                hiddenTagListId: 'j_idt16:hiddenTags',
                hiddenTagListName: null,
                validator: null,
                onlyTagList: false
                });
            };

        window.onload=function(){start();};
        </script>

    <h1 class="codeimps-form-h1">Make A Request!</h1>
<form id="j_idt16" name="j_idt16" method="post" action="/codeimps/faces/requestimp.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="j_idt16" value="j_idt16" />
<input id="j_idt16:hiddenTags" type="hidden" name="j_idt16:hiddenTags" value="code" />        <table>
<tbody>
<tr>
<td><span class="codeimps-form-description">Title</span></td>
<td><input id="j_idt16:input_Title" type="text" name="j_idt16:input_Title" size="32" />    </td>
<td></td>
</tr>
<tr>
<td><span class="codeimps-form-description">Description</span></td>
<td><textarea id="j_idt16:input_Description" name="j_idt16:input_Description" cols="28" rows="5" maxlength="140"></textarea></td>
<td></td>
</tr>
<tr>
<td><span class="codeimps-form-description">YouTube URL</span></td>
<td><input id="j_idt16:input_YouTubeURL" type="text" name="j_idt16:input_YouTubeURL" size="50" placeholder="video is worth a thousand words..." /></td>
<td></td>
</tr>
<tr>
<td><span class="codeimps-form-description">Tags</span></td>
<td><input id="j_idt16:input_Tags" type="text" name="j_idt16:input_Tags" size="32" autocomplete="off" class="input-medium tm-input tm-input-info" placeholder="enter a tag" data-original-title="" /></td>
<td></td>
</tr>
</tbody>
</table>
<input type="submit" name="j_idt16:j_idt29" value="submit" /><input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="nbewb1N+jemdQtriI+qX0ls6u52sq5PP9zurZDzvcC+hWpAZZzvit9A4K1zEKSrQOQ660omyB7Rm70LLWR8n4VJH4dxEduElZeL3TCr8s+fuXENAk/gh7G6frdvazPY+R6m1kI/Idny8kChhW/6UyvrFD267PlruL9Phcwc3pSmIM0TlDf1o3JkbRog0SG4ZjnEC1Y0i9YXitrHxmL7b7WNM0za8IUjQ47vxeC+TG6Ka+O05VMm0rtDoS9eP8T4r1WKP2xPcySMxSYMF11POnwc5dqj8x0FALnGpWU6Sd2BkplptShHSyVp9dN5R3Os5kzVjJUbmq730vdgb1wPVZDx4MoOKY+3f9czOTwvUCcoltRb9FLjlbEGcGeE8wtuSEPOT0KvxejxONWp9cIpeelNPOOMvlaaV6tDX1ChVAzhCvFKLYIbSqVhW8Jompg+A6VqmnWUqSqPlR+IZ24unBF4UedMzFyqljLbskku03QQr9XRpIyF7ar1eEP6A0zvc4u4NJbTcWfcyKTRyE7QNuGfeABycZEKemOQgwW6G8NzZd0LgkxGcsKjVI89Nryrj9iWyuJX+8qcQJQeX0IZjsVUFTlyPmuiLWad33uPwq3SLaLR40S4gpoquKC1p3PpWbWyTwBEiwACjDKRWFJIZgoXctrzpffOmH6Xhuk2527VDcCDaw2kJ2kU/9+8wD3bWae51zF5gEfiFYd3ykafI/H4Fr12VKnypxX4G9jqBapj39gxHn4s5PYKhapxgODO1hN6e5KYM61dFYyPwwCLEOqQjsZ9rvMXuINAJbyZxYslils2uc8I3ZS6v2xgGLSLAYBKE6aSWxa0F+eciLLtewxSS7ThDHw7MUj9OZUKxfQOYYXkAepYzp2UVI3N92qyIXxxUf+HaI3t4byAiHOtD7JytbAS/9CKXDAFn7b7wR9gOqNi8E4VivKODqWDcYbAd" autocomplete="off" />
</form>
</div>

<div id="footer">
         <h3 class="codeimps-impact codeimps-impact-h3">Copyright 2013-2014 Jody McAdams</h3>
</div></body>


最后说明:
我有一个名为“ RequestBean.java”的Java bean,除id =“ input_Tags”的输入外,该表单上的所有其他输入均有效

最佳答案

我阅读了tagmanager.js的源代码,不赞成使用hiddenTagListId字段。请改用output

例:

jQuery(".tm-input").tagsManager({
    output: 'input[id$=hiddenTags]'
});


顺便说一句,将子目录放置到name而不是library

<h:outputScript library="js" name="jquery/jquery-1.10.2.min.js"/>
<h:outputScript library="js" name="tagmanager/tagmanager.js"/>

关于java - JSF 2.2表单上的tagmanager.js不起作用。我究竟做错了什么?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/20834889/

10-10 18:01