Answers.Body: <p>The problem is likely that Craft has its attached its own <code>submit</code> handler to the form already, and jQuery event listeners are always triggered in the order  they were attached.</p>
  <p>You could verify that by doing a <code>$('form').off('submit')</code> (which, in theory, should de-register any existing event listeners for the <code>'submit'</code> event) - i.e.</p>
  <pre class="lang-js prettyprint-override"><code>$('form').off('submit');
  $('form').submit(function(e) {
      ...
  });
  </code></pre>
  <p>I don't think de-registering Craft's own event listeners is the best idea, though.</p>
  <p>You might have more luck hi-jacking the form's submit button instead of the actual form, i.e. something like this (untested):</p>
  <pre class="lang-js prettyprint-override"><code>$('form').on('button[type=&quot;submit&quot;]', 'click', function (e) {
     if (confirm('Are you sure you want to save?')) {
         return true;
     }
     e.preventDefault();
     return false;
  });
  </code></pre>
  <p>If that works, you should be almost there – although you'd probably have to hi-jack the form save shortcut as well (i.e. Cmd+S and whatever the Windows equivalent is).</p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-03-28T08:13:18.067Z
Answers.LastActivityDate: 2022-03-28T08:13:18.067Z
Answers.UserDisplayName: Mats Mikkel Rummelhoff
Body: <p>I've got a plugin that's got element types. I've got a <code>Transaction</code> element that I need the user to confirm before saving.</p>
  <p>I've tried to use the jQuery that comes with craft:</p>
  <pre><code>$('form').submit(function(e) {
      var txt;
      if (confirm(&quot;Are you sure you want to save?&quot;)) {
        txt = &quot;You pressed OK!&quot;;
      } else {
        txt = &quot;You pressed Cancel!&quot;;
        return false;
        e.preventDefault();
        e.stopPropagation();
        e.stopImmediatePropagation();
      }
  
      console.log(txt);
    })
  
  </code></pre>
  <p>but the element still saves on the edit page.</p>
  <p>How can I prevent the element from saving if the user clicks cancel.</p>
  
Tags: <plugin-development><elementtype>
Title: Custom plugin - show popup before element save
ThreadText: # Custom plugin - show popup before element save
  
  (Asked by: username_0 on 2022-03-25)
  
  I've got a plugin that's got element types. I've got a `Transaction` element that I need the user to confirm before saving.
  
  I've tried to use the jQuery that comes with craft:
  
  ```
  $('form').submit(function(e) {
      var txt;
      if (confirm("Are you sure you want to save?")) {
        txt = "You pressed OK!";
      } else {
        txt = "You pressed Cancel!";
        return false;
        e.preventDefault();
        e.stopPropagation();
        e.stopImmediatePropagation();
      }
  
      console.log(txt);
    })
  
  ```
  
  but the element still saves on the edit page.
  
  How can I prevent the element from saving if the user clicks cancel.
  
  **Tags:** plugin-development, elementtype
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2022-03-28. Score: 1
  
  The problem is likely that Craft has its attached its own `submit` handler to the form already, and jQuery event listeners are always triggered in the order they were attached.
  
  You could verify that by doing a `$('form').off('submit')` (which, in theory, should de-register any existing event listeners for the `'submit'` event) - i.e.
  
  ```js
  $('form').off('submit');
  $('form').submit(function(e) {
      ...
  });
  
  ```
  
  I don't think de-registering Craft's own event listeners is the best idea, though.
  
  You might have more luck hi-jacking the form's submit button instead of the actual form, i.e. something like this (untested):
  
  ```js
  $('form').on('button[type="submit"]', 'click', function (e) {
     if (confirm('Are you sure you want to save?')) {
         return true;
     }
     e.preventDefault();
     return false;
  });
  
  ```
  
  If that works, you should be almost there – although you'd probably have to hi-jack the form save shortcut as well (i.e. Cmd+S and whatever the Windows equivalent is).
  
  
  ---
  
  