दो पी में गंभीरता के आधार पर संदेश दिखाएं: growl

Question

मैं प्राइमफ़ेस पी का उपयोग कर रहा हूं: growl।

<p:growl id="msgsInfo" 
     rendered="true" 
     showDetail="true" /> 
<p:growl id="msgsError" 
     globalOnly="true" 
     showDetail="true" 
     sticky="true" /> 

मैं केवल Info संदेशों पहले ग्राउल में दिखाने के लिए है, जबकि दूसरे में मैं Error संदेशों दिखाने की जरूरत की जरूरत है। globalOnly का उपयोग करते समय जब मैं त्रुटि संदेश जोड़ता हूं तो यह 2 बार दिखाया जाता है।

कोई विचार?

Answer 1

यह सिद्धांत में संभव होगा यदि यह infoClass, errorClass, आदि h:messages जैसे गुणों का समर्थन करता है। आप बस एक सीएसएस वर्ग निर्दिष्ट कर सकते हैं जो display: none करता है।

लेकिन p:growl उन विशेषताओं का समर्थन नहीं करता है। गंभीरता स्तर पर आप infoIcon, errorIcon आदि द्वारा आइकन बदल रहे हैं, तो आप यहां बहुत खो गए हैं।

यह feature request के लायक हो सकता है।

ध्यान दें कि globalOnly="true" केवल संदेशों जो एक null ग्राहक आईडी उनकी गंभीरता की परवाह किए बिना है, प्रदर्शित करता है।

Answer 2

कृपया मेरे जवाब देखने

PrimeFaces growl change color dynamically (Multiple messages)

तुम भी परियोजना है जिसके नीचे पेज का उत्पादन के स्रोत कोड प्राप्त कर सकते हैं: मैं एक ही कार्यक्षमता के लिए देख रहा था

Answer 3

(एक विशिष्ट संदेश गंभीरता से चिपचिपा चिपकने के लिए)। प्राइमफेस (6.1) इस कार्यक्षमता की पेशकश नहीं करता है, लेकिन growl JavaScript हैक करना बहुत आसान है। विशेष रूप से, bindEvents समारोह में वे जाँच लें कि sticky कॉन्फ़िगर किया गया था और के आधार पर:

//hide the message after given time if not sticky 
if(!sticky) { 
    this.setRemovalTimeout(message); 
} 

तो, आप (ओवरराइड) bindEvents समारोह प्रोटोटाइप सकता है और संदेश गंभीरता के आधार पर sticky निर्धारित किया है।

PrimeFaces.widget.Growl.prototype.bindEvents = function(message) { 
    var _self = this, 
    sticky = this.cfg.sticky; 

    // Start hack 
    if (!sticky) { 
     // Your rule 
    } 
    ... 

तुम भी renderMessage प्रोटोटाइप और bindEvents को पैरामीटर के रूप गंभीरता जोड़ सकते हैं। मैंने एक त्वरित हैक का उपयोग करना चुना और className से इसे पढ़ा।

मैं इन उपयोगिता कार्यों को जोड़ दिया है:

if (!sticky) { 
    sticky = getSeverityIndex(getSeverity(message[0])) >= getSeverityIndex("error"); 
} 

मैं GitHub पर एक पुल अनुरोध जहां न्यूनतम गंभीरता को निर्धारित कर सकते हैं बना सकता है:

var SEVERITIES = [ "info", "warn", "error", "fatal" ]; 

function getSeverity(domNode) { 
    // HACK Severity can be found in the className after the last - character. 
    var severity = domNode.className; 
    return severity.substring(severity.lastIndexOf("-") + 1); 
} 

function getSeverityIndex(severityString) { 
    return SEVERITIES.indexOf(severityString); 
} 

अब आप निम्नलिखित की जांच का उपयोग कर सकते p:growl घटक पर stickSeverity विशेषता का उपयोग करके मालिश करें।

यहां पूर्ण जावास्क्रिप्ट हैक (प्राइमफेस 6 है।1):

var SEVERITIES = [ "info", "warn", "error", "fatal" ]; 

function getSeverity(domNode) { 
    // HACK Severity can be found in the className after the last - character. 
    var severity = domNode.className; 
    return severity.substring(severity.lastIndexOf("-") + 1); 
} 

function getSeverityIndex(severityString) { 
    return SEVERITIES.indexOf(severityString); 
} 

PrimeFaces.widget.Growl.prototype.bindEvents = function(message) { 
    var _self = this, 
    sticky = this.cfg.sticky; 

    // Start customization 
    if (!sticky) { 
     sticky = getSeverityIndex(getSeverity(message[0])) >= getSeverityIndex("error"); 
    } 
    // End customization 

    message.mouseover(function() { 
     var msg = $(this); 

     //visuals 
     if(!msg.is(':animated')) { 
      msg.find('div.ui-growl-icon-close:first').show(); 
     } 
    }) 
    .mouseout(function() { 
     //visuals 
     $(this).find('div.ui-growl-icon-close:first').hide(); 
    }); 

    //remove message on click of close icon 
    message.find('div.ui-growl-icon-close').click(function() { 
     _self.removeMessage(message); 

     //clear timeout if removed manually 
     if(!sticky) { 
      clearTimeout(message.data('timeout')); 
     } 
    }); 

    //hide the message after given time if not sticky 
    if(!sticky) { 
     this.setRemovalTimeout(message); 
    } 
}