1

I have added the following JS to a node form, it clones the submit button but clicking it inside the dialog (which does show up) doesn't submit the form in the browser, just nothing happens when the button is clicked. I also tried adding the button server side, same results:

(function (window, Drupal, $) {
  Drupal.behaviors.drafter = {
    attach: function attach(context) {
      var button = $('#edit-submit');
      var newbutton = button.clone().prop('id', 'edit-submit-drafter');
      button.click(function () {
        $('#drafter-elements').toggle();
        var confirmationDialog = Drupal.dialog('#drafter-elements', {
          resizable: false,
          closeOnEscape: false,
          create: function () {
            $(this).append(newbutton);
          },
          beforeClose: false,
          close: function (event) {
            $(event.target).remove();
          }
        });
        confirmationDialog.showModal();
        return false;
      })
    }
  }
})(window, Drupal, jQuery);

Where drafter-elements come from:

$form['drafter'] = [
  '#prefix' => '<div id="drafter-elements">',
  '#suffix' => '</div>',
  '#attached' => ['library' => ['drafter/drafter']],
];
$form['drafter']['save_in_place'] = [
  '#title' => 'Confirm',
  '#type' => 'checkbox',
  '#description' => t('By default a new draft will be created.'),
];

With a tiny CSS:

#drafter-elements {
  display: none;
}

(Here's the drafter repository should someone want to try it / fix it.)

  • You must create the second submit in a form alter look here, drupal.stackexchange.com/questions/99962/… – Jdrupal Aug 24 at 8:36
  • I tried, that does not work (the drifer-elements PHP section is already from drafter_form_node_form_alter). I will edit the question to make this clearer. – Smartsheet eng Aug 24 at 9:04
3

for me that submits the node:

(function (window, Drupal, $) {
  Drupal.behaviors.drafter = {
    attach: function attach(context) {
      var button = $('#edit-submit');
      var newbutton = button.clone().prop('id', 'edit-submit-drafter');
      var confirmationDialog = Drupal.dialog('#drafter-elements', {
        resizable: false,
        closeOnEscape: false,
        create: function () {
          $(this).append(newbutton);
        },
        beforeClose: false,
        close: function (event) {
          $(event.target).remove();
        }
      });
      newbutton.click(function (e) {
        button.click();
        confirmationDialog.close();
        return true;
      });
      button.click(function () {
        if (!confirmationDialog.open) {
          confirmationDialog.showModal();
          return false;
        }
      });
    }
  }
})(window, Drupal, jQuery);

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.