Cómo abrir una nueva ventana en el formulario enviar

Question

Tengo un formulario de envío y quiero que abra una nueva ventana cuando los usuarios envían el formulario para que pueda rastrearlo en análisis.

Aquí está el código que estoy usando:

<form action="http://URL at mailchimp subscriber URL.com" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" onclick=window.open(google.html,'','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');> 
    <label for="name">Your Name</label><input type="text" value="" name="FNAME" class="required" id="mce-FNAME"> 
    <br/> 
    <br/> 
    <label for="email">Your Email </label><input type="text" value="" name="EMAIL" class="required email" id="mce-EMAIL"> 
    <br/> 
    <br/> 
    <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="submit"> 
</form> 
</div> 

Answer 1

No hay necesidad de Javascript, sólo hay que añadir un atributo target="_blank" en su etiqueta del formulario.

<form target="_blank" action="http://example.com" 
     method="post" id="mc-embedded-subscribe-form" 
     name="mc-embedded-subscribe-form" class="validate" 
> 

Answer 2

window.open no funciona en todos los navegadores, Google y encontrará una forma de detectar el tipo de diálogo correcta.

Además, mueva la llamada por clic al botón de entrada para que solo se active cuando el usuario envíe.

Answer 3

El código que ha dado, necesita ser corregido. En etiqueta de formulario que tiene que adjunta el valor del atributo onClick en comillas dobles:

"window.open('google.htm','','scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');"

También es necesario tener cuidado de que primer parámetro de window.open también debe estar entre comillas.

Answer 4

onclick puede no ser el mejor evento para adjuntar esa acción. Cada vez que alguien haga clic en cualquier parte del formulario, se abrirá la ventana.

<form action="..." ... 
    onsubmit="window.open('google.html', '_blank', 'scrollbars=no,menubar=no,height=600,width=800,resizable=yes,toolbar=no,status=no');return true;"> 

Answer 5

Encontré una solución para esto también. Esta página me ayudó hoy, así que también estoy volviendo a publicar aquí.

/** This is the script that will redraw current screen and submit to paypal. */ 
echo '<script>'."\n" ; 
echo 'function serverNotifySelected()'."\n" ; 
echo '{'."\n" ; 
echo ' window.open(\'\', \'PayPalPayment\');'."\n" ; 
echo ' document.forms[\'paypal_form\'].submit();'."\n" ; 
echo ' document.forms[\'server_responder\'].submit();'."\n" ; 
echo '}'."\n" ; 
echo '</script>'."\n" ; 

/** This form will be opened in a new window called PayPalPayment. */ 
echo '<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" name="paypal_form" method="post" target="PayPalPayment">'."\n" ; 
echo '<input type="hidden" name="cmd" value="_s-xclick">'."\n" ; 
echo '<input type="hidden" name="custom" value="'.$transaction_start.'">'."\n" ; 
echo '<input type="hidden" name="hosted_button_id" value="'.$single_product->hosted_button_id.'">'."\n" ; 
echo '<table>'."\n" ; 
echo ' <tr>'."\n"; 
echo '  <td><input type="hidden" name="'.$single_product->hide_name_a.'" value="'.$single_product->hide_value_a.'">Local</td>'."\n" ; 
echo ' </tr>'."\n" ; 
echo ' <tr>'."\n" ; 
echo '  <td>'."\n" ; 
echo '  <input type="hidden" name="'.$single_product->hide_name_b.'" value="'.$single_product->hide_value_b.'" />'.$single_product->short_desc.' $'.$adj_price.' USD'."\n" ; 
       // <select name="os0"> 
       //  <option value="1 Day">1 Day $1.55 USD</option> 
       //  <option value="All Day">All Day $7.50 USD</option> 
       //  <option value="3 Day">3 Day $23.00 USD</option> 
       //  <option value="31 Day">31 Day $107.00 USD</option> 
       // </select> 
echo '  </td>'."\n" ; 
echo ' </tr>'."\n" ; 
echo '</table>'."\n" ; 
echo '<input type="hidden" name="currency_code" value="USD">'."\n" ; 
echo '</form>'."\n" ; 

/** This form will redraw the current page for approval. */ 
echo '<form action="ProductApprove.php" name="server_responder" method="post" target="_top">'."\n" ; 
echo '<input type="hidden" name="trans" value="'.$transaction_start.'">'."\n" ; 
echo '<input type="hidden" name="prod_id" value="'.$this->product_id.'">'."\n" ; 
echo '</form>'."\n" ; 

/** No form here just an input and a button. onClick will handle all the forms */ 
echo '<input type="image" src="https://www.sandbox.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" alt="PayPal - The safer, easier way to pay online!" onclick="serverNotifySelected()">'."\n" ; 
echo '<img alt="" border="0" src="https://www.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">'."\n" ; 

El código de arriba es el código de un botón. Presiona el botón y volverá a dibujar la pantalla actual desde la compra hasta la aprobación previa. Al mismo tiempo, abre una nueva ventana y le entrega esa nueva ventana a PayPal.

Answer 6

Generalmente utilizo un pequeño fragmento de jQuery globalmente para abrir cualquier enlace externo en una nueva pestaña/ventana. He añadido el selector para una forma para mi propio sitio y funciona bien hasta el momento:

// URL target 
    $('a[href*="//"]:not([href*="'+ location.hostname +'"]),form[action*="//"]:not([href*="'+ location.hostname +'"]').attr('target','_blank'); 

Answer 7

En una aplicación de base de datos basada en la web que utiliza una ventana emergente para mostrar impresas de datos de bases de datos, esto funcionó bastante bien para nuestras necesidades (probado en Chrome 48) ...

<form method="post" target="print_popup" action="/myFormProcessorInNewWindow.aspx" onsubmit="window.open('about:blank','print_popup','width=1000,height=800');">

el truco es para que coincida con el atributo target en la etiqueta <form> con el segundo argumento en la llamada window.open en el controlador onsubmit.

Answer 8

Para un efecto similar al de la forma target atributo, también se puede utilizar el atributo de formtargetinput[type="submit]" o button[type="submit"].

De MDN:

... este atributo es un nombre o una palabra clave que indica dónde mostrar la respuesta que se recibe después de enviar el formulario. Este es un nombre o una palabra clave para un contexto de exploración (por ejemplo, pestaña, ventana o marco en línea).Si se especifica este atributo, anula el atributo de destino del propietario del formulario de los elementos. Las siguientes palabras clave tienen un significado especial:

• _self: Cargue la respuesta en el mismo contexto de navegación que el actual. Este valor es el predeterminado si el atributo no está especificado.
• _blank: carga la respuesta en un nuevo contexto de navegación sin nombre.
• _parent: cargue la respuesta en el contexto de exploración principal del actual. Si no hay padres, esta opción se comporta del mismo modo que _self.
• _top: cargue la respuesta en el contexto de exploración de nivel superior (es decir, el contexto de exploración que es un antecesor del actual, y no tiene ningún elemento primario). Si no hay padres, esta opción se comporta del mismo modo que _self.