add a cancel button

By johnhelen on 5 Apr 2007 at 03:01 UTC

Hello

How I can add a Cancel button so that when I click this button, the browser goes back to the previous page

I have a look around but could not find out

Many thanks
john

Comments

Input?

bm123 commented 11 May 2007 at 15:48

I would like to know how to do this as well. Anyone have any input on this? It would be nice to give the user an option to back out of adding content at the form level instead of clicking a link? Could someone maybe help us out? Thanks

Me too

thompsonmkt commented 12 June 2007 at 16:34

Is there a standard way in drupal to handle a cancel button?

add for button

bm123 commented 13 June 2007 at 12:41

add this in your template.php file under your "node_form" hook.
$output .= "<input type='button' value='Cancel' onClick='cancelAction();' />";

then add this in the head section of your page.tpl.php file

<script>
    function cancelAction() {
      var cancel=confirm("Are you sure you want to cancel?")
      if (cancel==true)
      {
        history.back(1);
      }
      else
      {
        <!--  nothing happens-->
      }
    }
  </script>

Guy I work with figured this one out.

Maybe this?

jonfrancisskydiver commented 24 April 2008 at 18:08

A user browses to a page where they are presented with a submit changes button or cancel those changes button. Now if the user clicks on the cancel button, how do you in Drupal go back to the previous page. Perhaps this solution would work.

In the function that defines the $form variable include this snippet:

$form['cancel'] = array(
'#prefix' => '<div class="floatLeft">',
'#value' => '<input type="button" value="Cancel" id="cancel">',
'#suffix' => '</div>'
);

Then in an included javascript file, add this jQuery code:

$(function() {
$("#cancel").click(function() {
history.back(1);
});
});

I hope this helps.

Non-javascript reliant solution

webrascal commented 8 January 2010 at 01:29

I prefer to build solutions that don't have dependencies with javascript if I can help it.

In this case, when moving to the form I include a $_GET variable for the location to return to. Something like this:

$return_path = implode('/', arg());
$form_url = l(t('Your Form'), 'your/form/path', array('query' => array('return_path' => $return_path)));

Slip that variable into your form as a hidden variable so you can access it when your button is submitted.
Since when a button is pressed there is no submission handlers you need to check for that button before you render your form otherwise your required fields will complain.

Something like this:

function your_form_function(&$form_state, $something_else) {
  // redirect if we've had the 'Cancel' button pressed
  if (isset($form_state['post']['op']) && $form_state['post']['op'] == t('Cancel')) {
    drupal_goto($form_state['post']['return_url']);
  }

  $form = array();
  $form['return_url'] = array(
    '#type' => 'hidden',
    '#default_value' => $_GET['return_url']
  );
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit')
  );
  $form['cancel'] = array(
    '#type' => 'button',
    '#value' => t('Cancel')
  );
  // and the rest of your form stuff,...
}

Disclaimer: I've not copied that from working code or anything, just banged it out, so it may have a typo or two in it :)

Good solutions.

kaakuu commented 8 January 2010 at 01:45

Good solutions.

Cancel button

Bagz commented 26 January 2011 at 02:01

The fundamental issue is that type 'button' still submits the form, resulting in extra processing. To stop the button from submitting the form you need to change the html that Drupal has rendered and change the button type to 'button'. This can be done in a #post_render function which has access to, and can modify the html that Drupal has generated (as well as the form element).

The attribute '#attributes' adds the required javascript to the button to make the page go back to the previous page, same as the back button would.

A solution I have come up with is this:

	$form['submit'] = array(
		'#type' => 'submit',
		'#value' => t('Submit'),
	);
	
	$form['cancel'] = array(
		'#type' => 'button',
		'#value' => t('Cancel'),
		'#prefix' => '&nbsp; &nbsp; &nbsp;',
		'#attributes' => array('onClick' => 'history.go(-1); return true;'),
		'#post_render' => array('change_button_type'),
	);
	
	return $form;
}

function change_button_type($markup, $element) {
	$markup = str_replace('type="submit', 'type="button', $markup);
	return $markup;
}

notes:
tested in Drupal 7 only
the #prefix attribute is used to put some space between the submit and cancel buttons.

WORKS in D&, too!

Apfel007 commented 10 June 2011 at 08:42

WORKS in D&, too!

Thanks a millon brother

khanjeee commented 8 August 2011 at 09:43

U rock

Superb!

kevinsbath commented 29 January 2014 at 15:38

Cracking solution. Thank you.

Simpler solution without #post_render

jiv_e commented 5 December 2016 at 21:09

$form['cancel'] = array(
      '#type' => 'button',
      '#value' => t('Cancel'),
      '#attributes' => array('onClick' => 'history.go(-1); event.preventDefault();'),
    );

event.preventDefault() will prevent submitting.

This met my need. Here's some details.

sethpkendall commented 21 June 2017 at 14:48

Here is the way I used it within a form_alter. Adding it to the ['actions'] array places it nicely next to the submit button.

function mymodule_form_alter(&$form, &$form_state, $form_id) {
// Is this the form I want to edit?
if ($form_id == 'some_form' || $form_id == 'another_form') {
$form['actions']['cancel'] = array(
'#type' => 'button',
'#value' => t('Cancel'),
'#weight' => -1,
'#attributes' => array('onClick' => 'history.go(-1); event.preventDefault();'),
);
}
}

Cancel button

casperovich commented 4 June 2012 at 19:10

Drupal 7 solution.
Work for me :))

$form = array();
    $form['elem1'] = array(
      '#type' => 'textfield',
      '#title' => t('Title'),
      '#description' => t('Description'),
      '#required' => TRUE,
    );
    return confirm_form($form, '', 'admin/config', '', t('Save'), t('Cancel'));

Good luck