By ken nguyen on

Hi All,

I also create a popup form (I used bootstrap to do it). After I click the submit button - ajax will save the data to database successfully. (I did it successfully).

After that, I want to the popup close and the page reload (refesh). Any ideas for doing it?
Appreciate

⋅ Categories: Drupal 7.x

Comments

jaypan’s picture

jaypan
Location Victoria, BC
commented

You can use this method I outline here to call a function after an ajax event: http://www.jaypan.com/tutorial/calling-function-after-ajax-event-drupal-7

You can pass your command as follows:

$commands[] = array('command' => 'reloadPage');

Then in your JS, you can set up the command as follows:

Drupal.ajax.prototype.commands.reloadPage = function()
{
  window.location.reload();
}

Contact me to contract me for D7 -> D10/11 migrations.

ken nguyen’s picture

ken nguyen commented

Hi Jaypan,

First of all, I say thanks with you.

I also following your instruction but it didn't work. Please help me to take a look on this. My code as below

file page_auto_reload.module

function page_auto_reload_popup($form, &$form_state) {
	$form['#attached']['js'] = array
	(
		array
		(
			'type'  => 'file',
			'data' => drupal_get_path('modules', 'page_auto_reload') . '/page_auto_reload.js',
		),
	);

	$form = array();
  	$form['#prefix'] = '<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Test</button>'.
                      '<div class="modal fade" id="myModal" role="dialog"><div class="modal-dialog">';
    $form['#suffix'] = '</div></div>';    
    	
    $form['submit'] = array(
    	'#title' => t("Save"),
    	'#type' => 'submit',
    	'#ajax' => array(
      	'callback' => 'page_auto_reload_ajax_callback',
      	'wrapper' => 'replace_textfield_div'
    ),
    );
    return $form;
}

function page_auto_reload_ajax_callback($form, &$form_state) {
	$commands[] = array('command' => 'reloadPage');
	return array('#type' => 'ajax', '#commands' => $commands);
}

file page_auto_reload.js

(function($, Drupal)
{
	Drupal.ajax.prototype.commands.reloadPage = function()
	{
  		window.location.reload();
	}
}(jQuery, Drupal));
jaypan’s picture

jaypan
Location Victoria, BC
commented

You are declaring $form twice:

First:

function page_auto_reload_popup($form, &$form_state) {

$form is passed as an argument to your function here.

Then, you are attaching your JS to the $form variable here:

$form['#attached']['js'] = array
(
	array
	(
		'type'  => 'file',
		'data' => drupal_get_path('modules', 'page_auto_reload') . '/page_auto_reload.js',
	),
);

But right after that, you are overwriting your entire $form variable here:

$form = array();

So your JS is never attached. And you shouldn't declare the $form variable (in Drupal 7), as it is an argument that is passed to your function, so if it contains any code, you will overwrite it.

So to fix this, all you need to do is remove this line:

$form = array();

Contact me to contract me for D7 -> D10/11 migrations.

ken nguyen’s picture

ken nguyen commented

Hi Jaypan,

You are right about $form = array(). However, after I delete the line $form = array(), the popup form still available after I press submit button. The page not reload. Please focus

$form['#prefix'] = 'Test'.
'

';

Are anything wrong with my code? Could you please give me your idea to fix

jaypan’s picture

jaypan
Location Victoria, BC
commented

You'll need to do some debugging:

1) Is the .js file being attached?
2) Is your ajax callback function being called?
3) Is the prototype file in the .js file being called?

Contact me to contract me for D7 -> D10/11 migrations.

ken nguyen’s picture

ken nguyen commented

Thanks, I can do it successfully

alex_optim’s picture

alex_optim
Location Tallinn
commented 
$commands[] = ctools_ajax_command_reload();