Add confirmation pop-up to admin form "Save" button

Question

I have custom module which adds admin form. There is a button "Save" in the form container that saves the entire form and adds some data to the database.

I would like to avoid situation that user accidentally clicks the button. How to add a javascript to the button that would display (on button click) a pop-up window with text like:

"Are you sure you want save? Yes/No"?

If user clicks "Yes", then the default action for the "Save" button will be triggered and form will be submitted. If user clicks "No" then nothing happens. This will prevent accidentally saving the form.

Is there anything like this available in magento admin forms? If not, how to add this feature to my form?

class Super_Awesome_Block_Adminhtml_Example_Edit extends Mage_Adminhtml_Block_Widget_Form_Container
{
    public function __construct()
    {
        parent::__construct();

        $this->_blockGroup = 'awesome';
        $this->_controller = 'adminhtml_example';

        $this->_addButton(
            'my_button_save',
            array(
                'label' => Mage::helper('adminhtml')->__('Save'),
                'class' => 'save',
            ),
            100
        );
    }
}

Answer 1

Something like this may help you

 $base_fieldset->addField(
                'your_btn', 'button', array(
            'name' => 'your_btn',
            'label' => Mage::helper('testmodule')->__(
                    'Click on folowing link to test popup Dialog:'
            ),
            'value' => $this->helper('testmodule')->__('Test popup dialog >>'),
            'class' => 'form-button',
            'onclick' => 'javascript:openMyPopup()'
                )
        );
        $form->setUseContainer(true);
        $this->setForm($form);
        parent::_prepareForm();

Then in layout file

<?php echo $this->getFormInitScripts() ?>
<script type="text/javascript">
    function openMyPopup() {
        var url = '<?php echo $this->getUrl('adminhtml/dashboard/index') ?>?';
        if ($('browser_window') &amp;&amp; typeof(Windows) != 'undefined') {
            Windows.focus('browser_window');
            return;
        }
        var dialogWindow = Dialog.info(null, {
            closable:true,
            resizable:false,
            draggable:true,
            className:'magento',
            windowClassName:'popup-window',
            title:'Test popup Dialog',
            top:50,
            width:300,
            height:150,
            zIndex:1000,
            recenterAuto:false,
            hideEffect:Element.hide,
            showEffect:Element.show,
            id:'browser_window',
            url:url,
            onClose:function (param, el) {
                alert('onClose');
            }
        });
    }
    function closePopup() {
        Windows.close('browser_window');
    }
</script>

Answer 2

Magento gives you default validation process. You can use it. In your Grid.php,

For example you need validation for email field, So

protected function _prepareColumns()
  {
      $this->addColumn('email', array(
          'header'    => Mage::helper('sendsms')->__('Email'),
          'align'     =>'left',
          'index'     => 'email',
          'required'  => true,
      ));

[...]

}

Here 'required' => true, it enables validation for you..!

Thats it ..Cheers..!

Answer 3

I have to do this for promo (coupon) module in admin. So I am writing how to do this.

Module file:

<config>
<modules>
    <NS_Promo>
        <active>true</active>
        <codePool>local</codePool>
        <depends>
            <Mage_Adminhtml/>
        </depends>
    </NS_Promo>
</modules>

app/local/NS/Promo/etc/config.xml

<config>
    <modules>
        <Ns_Promo>
            <version>0.1.0</version>
        </Ns_Promo>
    </modules>
    <global>
        <blocks>
            <adminhtml>
                <rewrite>
                    <promo_quote_edit>NS_Promo_Block_Quote_Edit</promo_quote_edit>
                </rewrite>
            </adminhtml>
        </blocks>
    </global>
</config>

app/local/NS/Promo/Block/Quote/Edit

    class NS_Promo_Block_Quote_Edit extends Mage_Adminhtml_Block_Promo_Quote_Edit
{

    /**
     * Initialize form
     * Add "Save and Continue" button
     * 
     * Murtaza: added a js function to confirm 
     * if admin user wants to add promo withoud coupon
     */
    public function __construct()
    {
        parent::__construct();

        $this->_updateButton('save', 'onclick', 'return confirmFunction(\'save\');');
        $this->_updateButton('save_and_continue_edit', 'onclick', 'return confirmFunction(\'savencontinue\');');
    }
}

js confirmFunction is:

function confirmFunction(type) {
     if (!window.confirm('<?php echo Mage::helper('salesrule')->__('message?') ?>')) {
            return false;
        }

        if (type == 'save') {
            editForm.submit();
        } else {
            editForm.submit($('edit_form').action + 'back/edit/');
        }
}

hope this will help someone :)