function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Hitesh Grover 7Hitesh Grover 7 

apex:pagemessages

I am using apex:pagemessages to show error message on my VF page. I want to hide/disapper it in 2 seconds. Anyone tell me how can i do this?
Sukanya BanekarSukanya Banekar
Hi Hitesh,

write apex:pageMessages tag under div tag and write scripe to hide the div
<div id="pgmessagesid">
  <apex:pagemessages>
</div>

<script>
setTimeout(function() { $('#pgmessagesid').fadeOut('fast'); }, 2000);
</script>

Let me know if this helps you to solve your problem.

Thanks,
Sukanya Banekar
Amol Salve 13Amol Salve 13
Hello Hitesh,

 Use CSS to hide apex:pagemessage

<div id="pgmessagesid">
  <apex:pagemessages>
</div>

<script>
         #pgmessagesid{
                          -webkit-animation: cssAnimation 5s forwards;
                           animation: cssAnimation 5s forwards;
                       }
            @keyframes cssAnimation {
                             0% {opacity: 1;}
                            90% {opacity: 1;}
                            100% {opacity: 0;}
             }
            @-webkit-keyframes cssAnimation {
                           0% {opacity: 1;}
                          90% {opacity: 1;}
                           100% {opacity: 0;}
               }

</script>

Thank you,
Amol Salve
Salesforce Developer
Mustafa JhabuawalaMustafa Jhabuawala
Hitesh,

Let me know if I understood your problem correctly. Below are the details - 

Problem Statement - You want to hide the the message once there is an error message captured from server side. And once message is displayed then it should be disappeared in 2 seconds.

If yes, then -

You won't be able to achieve that using JavaScript or core jQuery code. Because you need an event which says the message is there now in the apex:pagemessage and once the message is displayed then only you need to hide that in next 2 seconds. So you can't do that in the page load using JavaScript or jQuery Code because there can be a case where the message is not captured on page load.

I would suggest not to go with apex:pagemessage in this case, you can use third party plugins to display message such as - jQuery toastr plugin

Ref Demo Link (http://codeseven.github.io/toastr/demo.html)


You can integrate this plugin and can achieve the same with much flexible way.

Hope this resolves your issue.

Thanks,
Mustafa Jhabuawala
Technical Lead at Zen4orce (http://www.zen4orce.com)