I have a button type element in a form. It has an ajax callback to some function that performs a delete operation. Everything works perfect.

I want to add a browser prompt when user clicks on the delete button. The prompt should ask user to confirm the delete action and only after the confirmation should the callback function be executed (using ajax of course).

How can I do this?

Following is the code for button element:

$form['delete'] = array(
  '#type' => 'button',
  '#value' => t("Delete"),
  '#element_validate' => NULL,
  '#ajax' => array(
    'callback' => 'delete_something',
    'wrapper' => 'delete-message',
  '#limit_validation_errors' => array(),

function delete_something(){
  //Some Code

1 Answer 1


This one should help you the same way you want to achieve the functionality. Instead of ajax callback I have created a ctools modal which will return the delete and cancel button..

"delete/nojs/1" where 1 will be the Item which you want to delete.

use this in your form.

$form['delete'] = array(
  '#markup' => ctools_modal_text_button(t('Delete'),"delete/nojs/1", t('Delete'), 'ctools-modal-modal-popup-small'),

create a menu item.

function custom_module_menu() {
  $items = array();
  $items['delete/%ctools_js/%'] = array(
    'type' => MENU_CALLBACK,
    'title' => t('Delete'),
    'page callback' => 'delete_something',
    'page arguments' => array(1,2),
    'access callback' => TRUE,
  return $items;

and call this function.

function delete_something($js = NULL) {
  if (!$js) {
    return drupal_get_form('delete_form');
  $form_state = array(
    'title' => t('Delete'),
    'ajax' => TRUE,
  $output = ctools_modal_form_wrapper('delete_form', $form_state);
  if (empty($output)) {
    $output[] = ctools_ajax_command_reload();    
  print ajax_render($output);

function delete_form($form_state = NULL){
  $form['message'] = array(
    '#prefix' => '<div class="delete_message">',
    '#value' => t('Are you sure want to delete?'),
    '#suffix' => '</div>',
  $form['submit']['delete'] = array(
    '#prefix' => "<div id = 'delete_button'>",
    '#suffix' => "</div>",
    '#value' => t('Delete'),
    '#type' => 'submit',
    '#submit' => array('delete_form_submit'),
  $form['submit']['cancel'] = array(
    '#prefix' => "<div id = 'cancel_button'>",
    '#suffix' => "</span></div>",
    '#value' => t('Cancel'),
    '#type' => 'submit',
  return $form;

function delete_form_submit($form, &$form_state) {
 //some code to delete
  • I can see the logic in this and it kinda makes sense. But It doesn't seem to work. Does this code work with ajax callbacks? does it need the ajax['wrapper'] property?
    – kmdhrm
    Dec 5, 2013 at 7:39
  • Sorry for the late reply as I was working with some other issue.But I have edited the code and hope this will help you to achieve this functionality. Dec 5, 2013 at 9:47

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.