[SalesForce] Trigger a popup alert message using checkbox

I am trying to display a pop-up alert with a message on the uncheck of checkbox. I am using Standard controller and need to implement this functionality on the Contact Page Layout. I have a custom checkbox field: Customer__c (default unchecked).

What my requirement is that when I check this,it should save normally (this is happening) but when some user tries to uncheck it, that user should get a pop-up alert with the message.

I have created a VF page for the same and a controller class. I have placed the VF page on the Standard Contact Page Layout keeping the Height as 0. But whenever I uncheck and try to save the record, the pop-up doesn't show up. What am I missing in my code (I don't get any compile/debug errors).

Below is the code for VF:

<apex:page standardcontroller="Contact" rendered="{!(Contact.Customer__c)}" >

<script type="text/javascript">

var msg="Unchecking this box will imply that the user has churned and will automatically de-activate in the Admin Panel.If you dont want that to happen, kindly check the box again";

    function throwalert{
       if ( {!Contact.Customer__c} == false)
       {
          alert(msg); setAlertVal();
       }
     }
     window.onclick = throwalert();
</script>
</apex:page>

This is the code for the controller:

public class PopUpAlert
{
public Contact cont;

  public PopUpAlert(ApexPages.StandardController controller){

   Contact cont = (Contact)controller.getRecord();
    cont=[select id,Customer__c from Contact where Id=: cont.ID];

  }
  public void setAlertVal(){
     cont.Customer__c = false;
     update cont;
  }
}

Best Answer

Since your original goal is prevent user uncheck the Customer__c flag on a Contact record, you can simple make the field disabled (read-only) on the page Layout. See Control User Access to Fields

Answer to the question "Why popup does not appear".

Please look at the code below:

if ( {!Contact.Customer__c} == false)

When a VF page renders this part {!Contact.Customer__c} transforms into true, since at the time of rendering this flag was actually true. When you uncheck this field, it does not change change in the part of of your JavaScript function because at this time you rendered VF page looks like:

if ( true == false)

Possible solution.

Option 1. Unfortunately, there is no a simple way to add an event listener to the standard element on a standard page. Though you can try adding a listener to the Customer__c field from your VF page, and assign a handler that would show a popup each time the checkbox is unchecked.

Option 2. Create a custom VF page which is a full copy of you standard Contact Page. Here it would be easier to add event listeners to the fields.

Related Solutions

[SalesForce] How to display alert message on a standard SF page on click of standard “save” button

Easiest way to do this is via a validation rule. Create a validation rule on the object you are saving that checks if an old product is selected. If so, display an error.

There are some alternatives like overriding the 'save' button with a javascript button, or overriding the complete page with VisualForce, but I wouldn't go there if validation rules work for you. An elaborate example can be found here: http://www.valnavjo.com/blog/modal-dialog-on-a-standard-salesforce-page/

[SalesForce] Popping Up Javascript Alert Box on Standard Page Layout

Prior to Summer '14, you could use the sidebar loading trick to inject JavaScript, but with this feature being removed, you'll have to rely on another mechanism.

Personally, if you're really hung up on the delete button showing some sort of confirmation dialog, I would suggest you create a Visualforce override. This gives you control over what's shown. Such an override might look like this:

<apex:page standardController="Account">
<apex:form>
<apex:pageMessages />
<apex:pageMessage severity="confirm" summary="Are you sure?" detail="You are about to delete this account. Are you sure you want to do this?" />
<apex:commandButton action="{!delete}" value="Delete" />
<apex:commandButton action="{!cancel}" value="Cancel" />
</apex:form>
</apex:page>

Then, assign it to the Delete button as an override, and they'll see the screen and have to confirm their choice. You can show whatever you want here, as it is Visualforce.

Using a trigger would show an outright error, preventing deletion entirely, which may not be ideal, and overriding the entire detail page just to add a confirmation dialog is not desirable either, for a variety of reasons (mostly being a waste of time, and making maintenance more expensive in terms of time).

Response to Edit

Since you are trying to prevent deletes, use a Visualforce page that attempts to delete, catches any errors, and displays them in a pretty format if any errors occur. This will let you reuse what you've already written. Or, you could have the Visualforce page check the condition, and show the error instead of even attempting to delete, but this is duplicating code.

Edit

Code example that shows the design to use:

<apex:page standardController="Account" extensions="accountDelete" action="{!deleterecord}">
    <apex:pageMessages />
</apex:page>

And the extension:

public with sharing class accountDelete {
    apexpages.standardcontroller controller;
    public accountDelete(ApexPages.StandardController controller) {
        this.controller = controller;
    }
    public pagereference deleteRecord() {
        try {
            delete controller.getRecord();
            return new pagereference('/home/home.jsp');
        } catch(exception e) {
            apexpages.addmessages(e);
        }
        return null;
    }
}

You can't call {!delete} directly because of the override, plus we're trying to catch the error, so you need a bit more code to support it.

Also, you'll want to spruce this up a bit, perhaps with a link back to the record, etc. Here's a screenshot of the code in action:

Can't Delete Record error in Visualforce