0

EDIT: Assume this is my VF page which i have simple input:

<apex:page standardController="Account" extensions="ErrorMessageInVfController">
 <apex:form >
   <apex:pageblock >
      <apex:pageMessages id="showmsg"></apex:pageMessages>
         <apex:panelGrid columns="2">
           Account Name: <apex:inputText value="{!acc.name}"/>
           Account Number: <apex:inputText value="{!acc.AccountNumber}"/>
           Account Phone: <apex:inputText value="{!acc.phone}"/>
           Account Site: <apex:inputText value="{!acc.site}"/>
           Account Industry: <apex:inputText value="{!acc.industry}"/>
           <apex:commandButton value="Update" action="{!save}" style="width:90px" rerender="showmsg"/>
         </apex:panelGrid>
    </apex:pageblock>
 </apex:form>
</apex:page>

Controller:

public with sharing class ErrorMessageInVfController {

public void save(){

     //... logic ... more code:
     //insert myRecord

       ApexPages.addmessage(new ApexPages.message(ApexPages.severity.CONFIRM,'Saved successfully!'));
}

The problem with the above approach is that once it displayed the ApexPages.message there is no way to close it will always be there until user refresh the entire page.

I'm looking a way to show the message and disappear by itself or have a close button next to the message.

I need a popup message to be displayed after user clicks on Save button in VF i have searched on the net but could not find anything close to it either its popup or a message is fine and any idea?

4
  • 1
    did you look at onclick="return confirm('are you sure?');" on your commandButton? – cropredy Mar 9 '16 at 1:51
  • i'm not talking about confirm message i will update my question with more detail. – Nick Kahn Mar 9 '16 at 2:55
  • I don't have a recipe for adding this to Visualforce, but do like the way Bootstrap's Dismissible alerts work; you give the user the choice of whether to remove them (by clicking the x) or not and they are simply a piece of the page that can be hidden. – Keith C Mar 9 '16 at 10:00
  • have you implement dismissible alerts in the VF page? – Nick Kahn Mar 9 '16 at 15:23
1

page

<apex:page standardController="Account" extensions="ErrorMessageInVfController">
 <style type="text/css">

        .popup
        {
            background-color: white;
            border-width: 2px;
            border-style: solid;
            z-index: 9999;
            left: 50%;
            padding:10px;
            position: absolute;
            width: 500px;
            margin-left: -250px;
            top:80px;
        }

        .popupBg
        {
            background-color:black;
            opacity: 0.20;
            filter: alpha(opacity = 70);
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            z-index: 9998;
        }

    </style>
 <apex:form >
   <apex:pageblock >
         <apex:panelGrid columns="2">
           Account Name: <apex:inputText value="{!account.name}"/>
           Account Number: <apex:inputText value="{!account.AccountNumber}"/>
           Account Phone: <apex:inputText value="{!account.phone}"/>
           Account Site: <apex:inputText value="{!account.site}"/>
           Account Industry: <apex:inputText value="{!account.industry}"/>
           <apex:commandButton value="Update" action="{!showPopup}" style="width:90px" rerender="showmsg,popup"/>
         </apex:panelGrid>
    </apex:pageblock>
    <apex:outputPanel id="popup">
        <apex:outputPanel styleClass="popupBg" layout="block" rendered="{!displayPopUp}"/>
        <apex:outputPanel styleClass="popup" layout="block" rendered="{!displayPopUp}">
            <apex:commandButton value="X" action="{!closePopup}" rerender="popup"/>
            <apex:pageMessages id="showmsg"></apex:pageMessages>
        </apex:outputPanel>
    </apex:outputPanel>
 </apex:form>
</apex:page>

class

public with sharing class ErrorMessageInVfController {

    public ErrorMessageInVfController(ApexPages.StandardController controller) {

    }

    public boolean displayPopup {get; set;}
    public void closePopup()
    {       
        displayPopup = false;   
    }    
    public void showPopup()
    {       
        displayPopup = true;
        save();   
    }   
    public void save(){
       ApexPages.addmessage(new ApexPages.message(ApexPages.severity.CONFIRM,'Saved successfully!'));
    }

}

apex:pagemessage not really required

2
  • pretty good 1+, is there a way to add condition to show only if update is done.... i haven't played with the save method yet... i think if we manipulate showPopup() method – Nick Kahn Mar 9 '16 at 4:03
  • is that possible to add faedin delay jquery function? $( "#success-btn" ).click(function() { $( "div.success" ).fadeIn( 300 ).delay( 1500 ).fadeOut( 400 ); }); – Nick Kahn Mar 9 '16 at 4:04
0

If you need to display a message w/without conditions within the visualforce page, you can use apex:pageMessage. Here is an example I read before.

2
  • the problem with that approach is that there is no way to close the message after it displayed. – Nick Kahn Mar 9 '16 at 1:44
  • you can use something like this infallibletechie.com/2012/07/popup-in-salesforce.html or/and put the apex:pageMessage inside the outputpanel and clear the message everytime you close the panel – Micz Domz Mar 9 '16 at 2:00
0

I found another way to Alert a message by doing something like this:

<apex:commandButton value="Update Me" action="{!updateBtn}" oncomplete="updateMessage();" reRender="script_block"/> 

JavaScript:

        <apex:outPutPanel id="script_block">
         <script>
          accountNumber = '{!myobjectname.AccountNumber}';
        </script>
        </apex:outPutPanel>

       <script>
         var accountNumber;
         function updateMessage(){
            alert('Updated successfully!' + accountNumber);
        }    
      </script>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.