Thursday, 28 July 2016

Using Salesforce standard modal in a Detail page button


Javascript button to open an iframe using Salesforce standard modal.


Create a detail page button, set it to javascript and add the following code:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
(function() {
    var box = new SimpleDialog("spoon" + Math.random(), true);
    box.setTitle("Dialog title");
    box.displayX = true;
    box.isMovable = false;
    box.createDialog();
    box.setWidth(750);
    box.setContentInnerHTML(
        "<iframe src='REPLACE WITH YOUR URL' frameborder='0' width='100%' height='380px' />"
    );
    //set the height of the modal
    box.dialog.children[1].style.height = '400px';
    box.show();
    //if displayX is true, then override standard close event by this code
    box.dialog.getElementsByClassName('dialogClose')[0].onclick = function() {
        box.hide();
    };
    //optional : add this to close the modal onclick of the overlay background
    box.background.addEventListener('click', function() {
        box.hide();
    });
})();

Output: