如何通过 jQuery 向 p:messages 组件设置消息？答案

【问题标题】：How to set a message to a p:messages component through jQuery?如何通过 jQuery 向 p:messages 组件设置消息？
【发布时间】：2015-04-10 16:36:02
【问题描述】：

我有以下 p:messages 组件：

<p:messages id="messageId" autoUpdate="true" closable="true" redisplay="false" />

我需要使用 jQuery 在其中显示一条消息，如下所示：

jQuery(#messageId).val("Error message");

这可能吗？

【问题讨论】：

标签： javascript jquery jsf primefaces

【解决方案1】：

$('messageId').append('<div class="ui-messages-error ui-corner-all"><span class="ui-messages-error-icon"></span><ul></ul></div>').children('ul').append('<li><span class="ui-messages-error-summary">' + summary + '</span><span class="ui-messages-error-detail">' + detail + '</span></li>')

假设消息组件的客户端ID是messageId。

【讨论】：

你不需要'#messageId'吗？
也许增强功能与咆哮具有相同的功能？

【解决方案2】：

要模拟 primefaces 的正确行为，您需要添加以下结构：

适用于只显示摘要，如果需要，您需要添加详细信息。

function mensaje(message, type){
    return '<div class="ui-messages-' + type + ' ui-corner-all">'+
        '<a href="#" class="ui-messages-close" onclick="$(this).parent().slideUp();return false;">'+
            '<span class="ui-icon ui-icon-close" />'+
        '</a>'+
        '<span class="ui-messages-' + type + '-icon" />'+
        '<ul>'+
            '<li>'+
                '<span class="ui-messages-' + type + '-summary">'+
                message +
                '</span>'+
            '</li>'+
        '</ul>'+
    '</div>';
};

这将返回消息的 html 结构，具体取决于您作为参数传递的类型（'error'、'info'、'warn'、'fatal'）。

现在你只需要把它放在正确的地方：

$('#idPMessage').append(mensaje(yourMessage, 'yourType'));

这将提示带有 X 的消息将其关闭以及 p:messages 的正常行为。

希望这会有所帮助。

【讨论】：

很好的答案。正是我想要的。