Adding target _blank to ajax form based on response

Question

I have been pulling my hair out on this for a few days now, and I cannot seem to actually execute something as simple as this successfully on submission of my form.

What I am trying to do is this... If I fill out my form and it passes validation and the ajax response is sold on click, I would like the form to go to /success and open a new tab/window that goes to google.com else just go to the failed page

It's simple I know. The problem is this, that when I do click it and have a new window/tab come up, the pop up window blocks it. This tells me that this method isnt really a valid method of clicking the button.

This is what I have as my form .module

    function storageform($form, &$form_state){

        $form['first_name'] = array(
            '#type'  => 'textfield',
            '#title' => t('First Name'),
            '#required' => TRUE,
        );

        $form['submit'] = array(
            '#type' => 'submit',
            '#value' => t('Submit'),
            '#ajax' => array(
                'callback' => 'storage_form_ajax_callback',
            ),
            '#attached' => array(
                'js' => array(
                drupal_get_path('module', 'storage_form') . '/storage_redirect.js' => array(
                'scope' => 'footer',
            ),
         ),
      ),
    );

        if(isset($form_state['values'])){
            $form['page_output'] = array(
            '#markup' => storagedb_submit($form, $form_state)
            ); 
        }
        return $form;   
    }




    /**
     ** Form Ajax
     **/
function storage_form_ajax_callback($form, $form_state) {

      $receipt_info = 'sold';

$commands = array();
      $commands[] = ajax_command_remove('div.messages');
      $commands[] = ajax_command_before('#main', theme('status_messages'));

    if(!form_get_errors()){
      $commands[] = array(
        // The command will be used in JavaScript file 
        'command' => 'storage_redirect',
        // JavaScript function:
        'itemstatus' => $receipt_info,
    );    

    }
    return array('#type' => 'ajax', '#commands' => $commands);
}

    function storage_form_ajax_callback_validate($form, $form_state){

        if($form_state['values']['first_name'] == ''){
            form_set_error('first_name', t('First name required.'));
        }
    }

storage_redirect.js

    (function($){
    Drupal.ajax.prototype.commands.payday_redirect = function(ajax, response, status){          
                if(response.leadstatus == 'sold'){
document.location.replace("http://localhost/storageform/thanks");
window.open('http://www.google.com','_blank');
                    }else{
document.location.replace("http://localhost/storageform/failed");
                }
        }
    }(jQuery, Drupal));

Please someone help me with this small nightmare of a problem I am having. Thank you.

Answer 1

I believe the answer is, you can't. Pop-up blocking is intended to prevent the browser from opening a new window or tab when the action was not initiated by the user (they click on a link). There are several ways to open a new window or tab; however, unless you can truly trick the browser into thinking the user actually clicked it (no, $(a).click() will not fool it) or the user has pop-up blocking turned off, you will always have the pop-up blocker doing it's intended duty.

I'm sure you're advising the user that you intend to open another window for them, why not just provide the link upon successful form submission? Alternatively, you can do a delayed redirect such as is often seen on, I believe, phpBB login screens (the ones that say, "Thank you for logging in. You will be redirected to XXX in 5 seconds").

Answer 2

A way to circumvent popup blocker would be to open new window directly on user click, with content like "Waiting for form validation". Direct user action can usually create new windows all right. Then, on ajax complete, either update that window with proper location, or simply close it.