1

I basically want to do what confirm_form does, but in a custom modal (I am gonna use a JS plugin to generate the confirm modal).

So what I have is a large hook_form_alter, and I am using the following code for the submit button. I am using workflow, so only certain submit buttons will have this behavior attached.

I have succeeded in attaching the behavior, and the popup shows every time you click the button. Unfortunately the node edit form still submits. Where I return the value in openDialog(), it should not save if value if false (if the user clicks NO). If the user clicks YES, save the node.

// Here I am adding the wrapper and adding the ajax attributes. Part of the `hook_form_alter`

$form['actions']['submit']['#prefix'] = '<span id="wf-wrapper">';
$form['actions']['submit']['#suffix'] = '</span>';
$form['actions']['submit']['#attributes']['class'] = array('workflow-submit', 'use-ajax-submit');

$form['actions']['submit']['#ajax'] = array(
    'event' => 'mousedown', 
    'callback' => 'confirm_save',
    'wrapper' => 'wf-wrapper',
    'prevent' => 'click',
    'method' => 'after'
);

// Here is the JS that doesn't work right now. The popup displays as it should but the form still submits.

$form['workflow_button_js'] = array(
    '#markup' => '<div id="buttonjs"><script type="text/javascript">
                  (function ($) {
                    function openDialog() {
                        vex.dialog.buttons.YES.text = "YES";
                        vex.dialog.buttons.NO.text = "NO";
                        vex.dialog.confirm({
                            message: "Have you verified that the information you are about to submit is accurate to the best of your knowledge?",
                            callback: function(value) {
                                if(value === true){
                                    Drupal.ajax.prototype.beforeSerialize();
                                }
                                //console.log(options);
                                return value;
                            }
                        });
                    }
                    // override the default confirmation dialog behavior
                    Drupal.behaviors.myModule = {
                        attach: function(context, settings) { 
                            Drupal.ajax["edit-actions-workflow-5"].options.beforeSerialize = function(form_values, element, options) {
                                openDialog();
                            }
                        }
                    }
                   })(jQuery);
                  </script></div>',
);

// This is just a callback because I have to have one, don't really know what or if I should return anything 
function confirm_save(&$form, &$form_state) {
    return 'submit';
}

EDIT I took your suggestions and updated the JS to what is below. The return value is now what I expected, but the form still submits on clicking NO (returning false). I looked at jQuery Form and was under the impression that returning false would stop a submit...

(function ($) {
    function openDialog() {
        vex.dialog.buttons.YES.text = "YES";
        vex.dialog.buttons.NO.text = "NO";
        return vex.dialog.confirm({
            message: "Have you verified that the information you are about to submit is accurate to the best of your knowledge?",
            callback: function(value) {
                return console.log(value);
            }
        });                     }
        // override the default confirmation dialog behavior
        Drupal.behaviors.myModule = {
            attach: function(context, settings) { 
                Drupal.ajax["edit-actions-workflow-5"].options.beforeSerialize = function(element, options) {
                    openDialog();
                }
            }
        }
})(jQuery);
4

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.