Another Update
I’m trying to implement the solution found here: Intercept click event on a button, ask for confirmation, then proceed, but the remove button still submits normally. I know my JS is targeting the correct element, because I can change other attributes on it like the background color.
Here’s my form:
function form_experiments_01() { $form['#attached']['js'] = array( drupal_get_path('module', 'form_experiments') . '/js/form_experiments.js', ); $form['managed_files'] = array( '#type' => 'fieldset', '#title' => t('Managed Files'), ); $num_docs = 3; for ($i = 1; $i <= $num_docs; $i++) { $form['managed_files'][$i] = array( '#type' => 'managed_file', '#title' => 'Managed File ' . $i, ); } $form['submit'] = array( '#type' => 'submit', '#value' => 'Submit', ); return $form; } Here’s my javascript:
(function ($) { Drupal.behaviors.managedFileAutoUpload = { attach: function(context, settings) { $('.form-item input.form-submit[value=Upload]', context).hide(); $('.form-item input.form-file', context).change(function() { $parent = $(this).closest('.form-item'); //setTimeout to allow for validation //would prefer an event, but there isn't one setTimeout(function() { if(!$('.error', $parent).length) { $('input.form-submit[value=Upload]', $parent).mousedown(); } }, 100); }); } }; Drupal.behaviors.managedFileConfirmRemove = { attach: function(context, settings) { var myButton = $('.form-item input.form-submit[value=Remove]', context); if (myButton.length > 0) { var myClick = null; //get a list of jQuery handlers bound to the click event var jQueryHandlers = myButton.data('events').click; console.log(jQueryHandlers); //grab the first jquery function bound to this event $.each(jQueryHandlers,function(i,f) { myClick = f.handler; return false; }); //unbind the original myButton.unbind('click'); //bind the modified one myButton.click(function(){ if(window.confirm("Are You Sure?")){ myClick(); } else { return false; } }); } } } })(jQuery); Update
After some more research I found this question. This is what I was trying to ask but didn’t know how to word.
Intercept click event on a button, ask for confirmation, then proceed
I’ll implement this solution and post a resolution once I’ve got it working.
Description
I would like to add a confirmation tooltip when the “remove” button is clicked on my managed_file field.
I would like to do something similar to this:
What is the best way to do that?
Possible Solution?
So far, I’m thinking I could probably use javascript to hide the remove button and instead display my own button. Then when my button is clicked, I can trigger a popup that contains a second custom button to cancel and the remove button that I originally hid.
I’m worried that this solution is a bit messy. Is there a more elegant way to do this? Can I get a similar behavior without hiding the original remove button?
Similar Questions
I’m not sure if these apply to my use-case since I’m working with a managed_file field. So far, I’ve been unable to implement similar solutions without the default behavior of the remove button interfering.
