web-dev-qa-db-fra.com

Fermer ColorBox iFrame après soumission

J'utilise jQuery ColorBox pour afficher un article du panier. Lorsqu'un utilisateur entre la quantité dans l'iFrame (ouverte avec colorbox) et clique sur le bouton d'envoi, je souhaite que l'iFrame soit fermé et que la fenêtre principale (parent) soit actualisée automatiquement.

Je veux dire que je veux deux choses après avoir soumis des données sur iFrame: 

  1. iFrame se ferme automatiquement.
  2. La fenêtre parente s'actualise automatiquement.

Sil te plait aide moi.

jqueryiframecolorbox
18
diEcho

utilisez ceci sur la fenêtre parente lors de l'ouverture d'iframe:

$(document).ready(function(){
    $(".chpic").colorbox({width:"80%", height:"80%", iframe:true, 
        onClosed:function(){ location.reload(true); } });
});

et ceci pour fermer l'iframe dans la page d'iframe:

parent.$.fn.colorbox.close();
36
nik

Une fois le formulaire soumis dans l'image 1, vous pouvez utiliser le code JavaScript suivant pour recharger l'image parent:

window.parent.location.reload(true);
3
barsh
<form target="_top">
2
Amien

open jquery.colorbox.js trouve ces deux morceaux de code: 

$close.click(function () {
  publicMethod.close(); 
});


$overlay.click(function () {
  if (settings.overlayClose) {
    publicMethod.close();
  }
});

remplace par ceux-ci - notez l'ajout de "window.location.reload ();" 

$close.click(function () {
  publicMethod.close();
  window.location.reload();         
});


$overlay.click(function () {
  if (settings.overlayClose) {
    publicMethod.close();
    window.location.reload();
  }
});
2
Rohan4

Donnez une étiquette de formulaire comme ceci:

<form target="_top">

puis après soumission:

response.redirect("your form")
1
karthik

Il suffit simplement de simuler un clic sur le bouton de fermeture, comme ceci: 

$("#cboxClose").click();
1
Lilla

Je voudrais jeter un oeil à http://colorpowered.com/colorbox/core/example1/index.html

Plus précisément, regardez "Exemple avec des alertes"

1
sberry

Si vous utilisez Drupal 7, vous devrez peut-être utiliser l’alternative suivante:

parent.jQuery.colorbox.close();

Dans D7, le $ .fn semble être remplacé par l'objet jQuery.

J'ai simplement configuré un rappel de menu qui a simplement renvoyé ceci:

return <<<EOF
<script type="text/javascript">
  <!--//--><![CDATA[//><!--
  parent.jQuery.colorbox.close();
  //--><!]]>
</script>
EOF;

Semblait bien fonctionner pour moi :)

0
Nick

Si vous voulez rester sur la page actuelle:

  1. écrivez le code suivant sur la page parente où colorbox est appliquée.

    $(document).ready(function(){

 $(".tu_iframe_800x600").colorbox({width:"80%", height:"100%", iframe:false 

  });
});

  2. et le code suivant sur votre page actuelle où vous souhaitez fermer colorbox parent.$.fn.colorbox.close();

Remarque: veuillez remplacer .tu_iframe_800x600 par votre classe html sur laquelle la colorbox est appelée ...

0
jalalkhan121