2013-11-25 15 views
5

Si prega di consultare l'aggiornamento (11/27) sottoshowModalDialog; Apre una nuova finestra in IE

ho una finestra modale che viene lanciato con il suo contenuto in un iframe (ASP applicazione webforms). Abbiamo bisogno di avere il reindirizzamento modale a un'altra pagina, ma non può essere all'interno dell'iframe a causa di motivi di sicurezza (pagina di elaborazione di Paypal). In modalità standard Chrome e IE, abbiamo un codice che cambia correttamente l'URL del modale a quello giusto. Tuttavia, in modalità di compatibilità, il reindirizzamento provoca l'apertura di una nuova finestra modale con l'URL corretto. Come possiamo impedirgli di aprire una nuova finestra e in realtà di reindirizzare?

Questo è il nostro codice corrente:

dialog.redirect = function (location, ignoreFrames) { 
     /// <summary>Redirects the dialog to a new URL</summary> 
     /// <param name="location" type="String"></param> 
     /// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param> 

     if (ignoreFrames === undefined) { 
      ignoreFrames = true; 
     } 

     if (ignoreFrames === true) { 
      if (window.top) { 
       //Chrome and IE9+ 
       window.top.document.location.replace(location); 
      } else { 
       //This was a supposed fix but it did not change the outcome 
       //<IE8 and compat mode 
       var redirectLink = document.createElement("a"); 
       redirectLink.href = location; 
       document.body.appendChild(redirectLink); 
       redirectLink.click(); 
      } 
     } else { 
      window.document.location.replace(location); 
     } 
    }; 

Aggiornamento 11/27, con l'esempio di emissione:

Interactive Example (Richiede IE10 + o qualsiasi buon browser)

Il seguente è un esempio del problema, con tutto ciò che è stato creato. Quando la modale è in modalità compatibilità IE, apre una nuova finestra invece di reindirizzare la modale. Correggere la pagina in modalità di compatibilità non è un processo semplice, poiché la nostra applicazione si basa sulla modalità di compatibilità e la pagina modale esterna è ampiamente utilizzata ovunque. Visualizzando la pagina (main.html) in FireFox (Chrome ha quel problema di sicurezza del dominio), funziona come previsto; la modale è completamente reindirizzata alla nuova pagina.

main.html

<html> 
<head></head> 
<body> 
    <a href="javascript:window.showModalDialog('modal.html', self, 'status:no;resizable:yes;help:no;scroll:no;width:1000;height:600')">Open Modal</a> 
</body> 
</html> 

modal.html

<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]> <html class="lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]> <html class="lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class=""> <!--<![endif]--> 
    <head> 
     <title id="tagTitle"></title> 
    </head> 
    <body style="margin:0px">  
     <form name="Form1" method="post" action="" id="Form1"> 
      <strong>modal.html</strong><br /> 
      <iframe frameborder="1" src="frame.html" scrolling="yes"></iframe> 
     </form> 
    </body> 
</html> 

frame.html

<!DOCTYPE html> 
<!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml"> <![endif]--> 
<!--[if IE 7 ]> <html class="ie7" xmlns="http://www.w3.org/1999/xhtml"> <![endif]--> 
<!--[if IE 8 ]> <html class="ie8" xmlns="http://www.w3.org/1999/xhtml"> <![endif]--> 
<!--[if IE 9 ]> <html class="ie9" xmlns="http://www.w3.org/1999/xhtml"> <![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> 
<html class="" xmlns="http://www.w3.org/1999/xhtml"> 
<!--<![endif]--> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
</head> 
<body> 
<strong>frame.html</strong><br /> 
<a href="javascript:void(0)" onclick="redirectToCart();" title="My Cart">Trigger Redirect</a> 

<script type="text/javascript"> 
    var redirect = function (location, ignoreFrames) { 
     /// <summary>Redirects the dialog to a new URL</summary> 
     /// <param name="location" type="String"></param> 
     /// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param> 

     if (ignoreFrames === undefined) { 
      ignoreFrames = true; 
     } 

     if (ignoreFrames === true) { 
      window.top.document.location.replace(location); //IE will create a new window at this point, instead of changing the modal's URL 
     } else { 
      window.document.location.replace(location); 
     } 
    }; 

    function redirectToCart() { 
     redirect('anotherpage.html', true); //Change this to false to see just the inner frame's URL change 
    } 
</script> 
</body> 
</html> 

anotherpage.html

<html> 
<head> 

</head> 
<body> 
    <strong>anotherpage.html</strong><br /> 
    Success 
</body> 
</html> 
+0

Posso ottenere un feedback sulla mia risposta? L'ha risolto per te? – Trevor

+1

Stava proprio per verificarlo! –

risposta

7

tuo problema nasce dal fatto che si sta utilizzando showModalDialog che introduce questo comportamento quando si utilizza IE.

Si può leggere su di esso qui:

showModalDialog Opens a New Window

Se si desidera continuare a utilizzare showModalDialog ecco un lavoro intorno:

modal.html

<head> 
    <base target="_self" /> 
    ... 
</head> 
<body style="margin:0px">  
     .... 
     <a href="anotherpage.html" id="go" style="display:none;"></a> 
    </form> 
</body> 

frame.html

function redirectToCart() { 
    window.parent.document.getElementById('go').click(); 
} 

Esempio

http://plnkr.co/edit/ClxlWqkzBmTy93kJzuru?p=preview

+1

Ah, avevo l'impressione che fosse qualcosa del genere, ma non ho trovato nessuna prova. Grazie, l'ha risolto. –

Problemi correlati