Adding Confirmation prompt when saving about trestle HOT 3 CLOSED

I see a couple of possible reasons why your handlers aren't being called in your examples:

In the first handler, you are a) missing periods (.) before the classes, and b) not targeting the button elements, and in the second handler, the form id is most likely incorrect (Rails will use an underscore instead of a hyphen).

Secondly, you will probably need to wrap the whole lot in a Trestle.init block to ensure that they are set up on all pages, dialogs, etc, particularly if you are using Turbolinks.

Thirdly, you will need to stop the event propagation to prevent rails-ujs from still processing the form submission.

Here is how I would add a simple global save confirmation handler in the current version of Trestle:

Trestle.init(function (root) {
  $(root).find('[data-behavior="trestle-form"]').on('submit', function (e) {
    if (!confirm('Are you sure?')) {
      e.preventDefault()
      e.stopImmediatePropagation()
    }
  })
})

Note: I am getting close to releasing an update to Trestle that uses Turbo and Stimulus, which will require a different approach.

from trestle.

Ahh thanks,

I wasn't able to notice the missing periods (.) for my jQuery Selectors as of writing my post.

I was also able to resolve this using a general way as well, turns out the jQuery setup works just fine turns out I had a couple missing code for it to work properly

this solution I've written down earlier isn't elegant but it was able to get me to what I needed as well.

$(document).ready(function() {
  $('.btn-success').click(function() {
    confirm("Are you sure?");   
  });
});

I'll be updating the code I'm using with your suggested code since it and more targeted to the forms themselves compared to my current implementation which can help avoid a lot of mistakes down the line in my app.

from trestle.

For future references, for the current version of Trestle (0.9.5) you can try adding this to your custom.js as well

I've managed to merge both codes into one and relied on jQuery to do its thing.

$(document).ready(function() {
  $('[data-behavior="trestle-form"]').on("submit", function(e) {
    if (!confirm('Are you sure?')) {
      e.preventDefault()
      e.stopImmediatePropagation()
    }
  });
});

from trestle.