使用jQuery插入HTML代码到Primefaces对话框中

问题描述：

我试图在Primefaces对话框中动态插入html代码。我想追加的html代码取决于电子邮件正文。使用jQuery插入HTML代码到Primefaces对话框中

比如我要添加viewEmail DIV中的HTML代码如下：

<h2>Resetting your Password</h2> 
<p>Hi Juan Pablo Proverbio,</p> 
<p>You've indicated that you've forgotten your password and would like to reset it. We've started the process by sending you a special code that you can use to reset your password.</p> 
<p>In order to complete this process, copy the code below and go back to the page on the app or webpage when you started this process and enter the code in the place indicated on that page.</p> 
<p>Here are your details:</p> 
<p>email address: 
    <b>[email protected]</b> 
</p> 
<p>reset code: 
    <b>LxoAd5NM</b> 
</p> 
<p>Once you've entered this code you will be able to create a new password for your account.</p> 
<p>If you've remembered your password, just ignore this code and keep using your current password. Please note that this code is only valid for 24 hours, so if you haven't used it by then you will need to start the process again. </p> 
<p>If you didn't start this process by using a 'Forgot my Password' function on an app or website related to [Serv] then someone has done this using your email address. You can just ignore this email and your password won't be changed. If this keeps happening, please contact us.</p> 
<p>Have a great day :)</p> 
<p style="font-size:70%;">This email was sent to you because you are registered on [Serv] using the email address: [email protected] and someone requested a password reset for your account.</font></p>

，这是我的看法对话框：

<h:form id="viewEmailForm"> 
     <p:dialog header="Email viewer" 
       widgetVar="viewEmail" showEffect="puff" hideEffect="drop" width="600"> 

      <h:panelGrid columns="2"> 
       <p:outputLabel value="To"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.to}"/> 

       <p:outputLabel value="From"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.from}"/> 

       <p:outputLabel value="Subject"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.subject}"/> 

       <p:outputLabel value="Email body"/> 
       <div class="viewEmail"> 

       </div> 

       <p:outputLabel value="Type"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.bodyType}"/> 

       <p:outputLabel value="Retries"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.retries}"/> 

       <p:outputLabel value="Last error"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.lastError}"/> 

       <p:outputLabel value="Status"/> 
       <p:outputLabel value="#{emailBean.selectedEmail.status}"/> 

       <p:outputLabel value="Created info"/> 
       <p:outputLabel value="#{emailBean.convertCreatedDate()}"/> 

      </h:panelGrid> 
      <f:facet name="footer"> 
       <p:commandButton value="Close" type="button" styleClass="ui-confirmdialog-no" 
            icon="ui-icon-close" onclick="PF('viewEmail').hide()" 
            style="float:right !important; margin-bottom: 10px !important"/> 
      </f:facet> 
     </p:dialog> 
</h:form>

我现在差jQuery脚本是：

<script id="viewEmailScript" type="text/javascript"> 
    $(".viewEmail").append(#{emailBean.selectedEmail.body}); 
</script>

但它不起作用。

你有什么建议如何使用jQuery从primefaces组件追加这个html代码？

答

为了呈现html代码，任何人只需要在primefaces outputLabel中添加escape =“false”以将该值附加为html代码即可。

<p:outputLabel value="#{emailBean.selectedEmail.body} " escape="false"/>

谢谢！

使用jQuery插入HTML代码到Primefaces对话框中

相关推荐