APEX 5.1 auto hide success message
Auto Client side error messages handling
Follow up post on few posts out there
Recently I noticed few blog posts on this problem and lazy me said cool something interesting and useful that I would want to reuse. Then I noticed few issues and wanted to write this blog in order to complete the picture.
Situation
We have form or interactive grid where we can edit and save some data. Excellent but why does not this success message that confirms all went well auto retrieves. How do we sort that?
As you see user has to click in order to close the mesage.
Solution
There are few blog posts out there dealing with the same issue but none were complete or better said they worked perfectly in certain situation. At least we were getting still some issues so we decided to merge them into one. :)
Marko's blog explains in detail how to sort this out on IG type of page which is awesome. But what happens if you by accident set this up
apex.message.setThemeHooks({
beforeShow: function(pMsgType, pElement$){
setTimeout(function() {
$('.t-Alert').fadeOut('slow');
}, 3000);
}
});
to be executing on page load on your Page 0 global page. It breaks some of modal page functionality if modal page gives throws any error. So make sure you use
if (pMsgType=='success'){
condition. Also it did not seem to sort issues with regular Form submits.
Other one was from Mark.
Which on the other hand sorts the problem of saving the regular form by auto dismissing the message. But it would get stuck if user would click on 'X' trying to manually close the message.
All credentials go to original posters of course. For my future reference this was what worked for me:
apex.jQuery(document).ready(function() {
var opt = {
autoDismiss: true,
duration: 3000 // Optional. Default value is 3000
}
// this only applys configuration when base page has a process success message ready to display
apex.theme42.configureSuccessMessages(opt);
if (apex.theme42.configureSuccessMessages.options === undefined) {
apex.theme42.configureSuccessMessages.options = opt;
}
//Marko code
apex.message.setThemeHooks({
beforeShow: function(pMsgType, pElement$){
if (pMsgType=='success'){
setTimeout(function() {
$('.t-Alert').fadeOut('slow');
}, 3000);
}
}
});
//Additional
$('.t-Button--closeAlert').click( function(){
$('.t-Alert').fadeOut('slow');
//console.log('clicked');
});
});
Only in this combination things seems to work.Happy Apexing,
SLino
Tested on internal and apex.oracle.com on APEX version 5.1.1.00.08
