¿Cómo se publica en un iframe?

229

¿Cómo se publican datos en un iframe?¿Cómo se publica en un iframe?

2008-10-03 Murtaza Mandvi

356

Depende de lo que quiere decir con "datos de publicación". Usted puede utilizar el código HTML target="" atributo en una etiqueta <form />, por lo que podría ser tan simple como:

<form action="do_stuff.aspx" method="post" target="my_iframe"> 
    <input type="submit" value="Do Stuff!" /> 
</form> 

<!-- when the form is submitted, the server response will appear in this iframe --> 
<iframe name="my_iframe" src="not_submitted_yet.aspx"></iframe>

Si no es eso, o lo que busca es algo más complejo, por favor editar su pregunta para incluir más detalles.

Existe un error conocido con Internet Explorer que solo ocurre cuando crea dinámicamente sus iframes, etc. usando Javascript (hay un work-around here), pero si utiliza el marcado HTML normal, está bien. El atributo del objetivo y los nombres de los marcos no son algunos ingeniosos hack de ninjas; aunque estaba en desuso (y por lo tanto no validará) en HTML 4 Strict o XHTML 1 Strict, ha sido parte de HTML desde 3.2, es formalmente parte de HTML5, y funciona en casi todos los navegadores desde Netscape 3.

He verificado que este comportamiento funciona con XHTML 1 Strict, XHTML 1 Transitional, HTML 4 Strict y en el "modo peculiar" sin DOCTYPE especificado, y funciona en todos los casos con Internet Explorer 7.0.5730.13. Mi caso de prueba consta de dos archivos, que usan ASP clásico en IIS 6; se reproducen aquí por completo para que puedas verificar este comportamiento por ti mismo.

default.asp

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC 
    "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
    <title>Form Iframe Demo</title> 
    </head> 
    <body> 
    <form action="do_stuff.asp" method="post" target="my_frame"> 
    <input type="text" name="someText" value="Some Text" /> 
    <input type="submit" /> 
    </form> 
    <iframe name="my_frame" src="do_stuff.asp"> 
    </iframe> 
    </body> 
</html>

do_stuff.asp

<%@Language="JScript"%><?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC 
    "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
    <title>Form Iframe Demo</title> 
    </head> 
    <body> 
    <% if (Request.Form.Count) { %> 
    You typed: <%=Request.Form("someText").Item%> 
    <% } else { %> 
    (not submitted) 
    <% } %> 
    </body> 
</html>

estaría muy interesado en escuchar de cualquier navegador que no se ejecuta correctamente estos ejemplos.

Fuente

2008-10-03 19:28:18

Como se señaló más adelante, el objetivo en el formulario puede no funcionar en IE7-usted desea probar eso. – NexusRex

@NexusRex - probado, y sí, funciona bien en IE7.:) –

+12

El problema con IE 7 es que si genera el iframe usando javascript, la etiqueta del nombre no está configurada (incluso si intenta establecerla) por qué fallará el objetivo de la publicación. La solución para IE7: http://stackoverflow.com/questions/2181385/ie-issue-submitting-form-to-an-iframe-using-javascript – mrD

Un iframe se utiliza para incrustar otro documento dentro de una página html.

Si el formulario se debe enviar a un iframe dentro de la página del formulario, se puede obtener fácilmente utilizando el atributo de destino de la etiqueta.

Establezca el atributo de destino del formulario en el nombre de la etiqueta iframe.

<form action="action" method="post" target="output_frame"> 
    <!-- input elements here --> 
</form> 
<iframe name="output_frame" src="" id="output_frame" width="XX" height="YY"> 
</iframe>

uso objetivo iframe avanzada
Esta propiedad también se puede utilizar para producir un Ajax como la experiencia, sobre todo en casos como el archivo de carga, en cuyo caso donde se convierte en obligatoria para enviar el formulario, para cargar los archivos

El iframe se puede establecer en un ancho y alto de 0, y el formulario se puede enviar con el objetivo establecido en el iframe y se abrió un cuadro de diálogo de carga antes de enviar el formulario. Por lo tanto, se burla de un control ajax ya que el control aún permanece en el formulario de entrada jsp, con el cuadro de diálogo de carga abierto.

Exmaple

<script> 
$("#uploadDialog").dialog({ autoOpen: false, modal: true, closeOnEscape: false,     
      open: function(event, ui) { jQuery('.ui-dialog-titlebar-close').hide(); } }); 

function startUpload() 
{    
    $("#uploadDialog").dialog("open"); 
} 

function stopUpload() 
{    
    $("#uploadDialog").dialog("close"); 
} 
</script> 

<div id="uploadDialog" title="Please Wait!!!"> 
      <center> 
      <img src="/imagePath/loading.gif" width="100" height="100"/> 
      <br/> 
      Loading Details... 
      </center> 
</div> 

<FORM ENCTYPE="multipart/form-data" ACTION="Action" METHOD="POST" target="upload_target" onsubmit="startUpload()"> 
<!-- input file elements here--> 
</FORM> 

<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;border:0px solid #fff;" onload="stopUpload()"> 
     </iframe>

Fuente

2012-06-21 04:46:15 kapil

¿Cómo se publica en un iframe?

Respuesta

Cuestiones relacionadas