[SalesForce] How to display the pop-up from error message block

i am displaying the error message in visualforce page by using apex:pageMessages
in this error block i need the hyperlink when i click on hyper it have to open the custom pop-up in that pop-up i have to display the some error information,
can any one suggest me how to call the custom-pop method.

Visualforce

<apex:outputpanel id="messages">
<apex:pageMessages escape="false"/> 
</apex:outputpanel>  

Apex Clas:

addErrorMessage(duplicates +' values alerdy there.<a href="/">test</a>');

Best Answer

Well, you are doing it correctly. You will be required to add and event handler on the <a> tag you have defined. I tried it using jQuery dialog.

Apex Page:

<apex:page controller="ErrorMSG" >
    <apex:pageMessages escape="false" rendered="true" ></apex:pageMessages>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css"/>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css"/>        
    <div id="dialog" title="Basic dialog">
        <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
    </div>
    <script>
    $j = jQuery.noConflict();
    $j( "#popup" ).click(function(){
        $j( "#dialog" ).dialog();
    })
    </script>
</apex:page>

Controller

public class ErrorMSG {
    public ErrorMSG(){
        ApexPages.addMessage(new ApexPages.Message(ApexPages.Severity.WARNING , 'You have received an error <b><u> <span id="popup">Click for Details</span><u></b>'));
    }
}

Result

Error Dialog

You will be required to refine the code and surround the dialog by outputpanel and re-render it if there is a failure and hide dialog at start.