JQuery Colorbox et Forms

Question

J'ai un formulaire que je veux soumettre et montrer dans Colorbox.

Le formulaire est Mals Ecommerce Voir le panier.

Voir: https://www.mals-e.com/tpv.php?tp=4

Je veux qu'il affiche le contenu du panier dans un colorbox iframe. Est-ce possible de faire en utilisant la méthode FORM plutôt que la méthode Link?

Answer 1

Essayez

$("input#formsubmit").colorbox({title: function(){ 
    var url = $(this).parents('form').attr('action'); 
}}); 

Non testé, je viens de prendre la syntaxe de la page Colorbox. Vous devez donner à votre bouton de soumission un identifiant de "formsubmit" pour que cela fonctionne.

Answer 2

vous pouvez ouvrir colorbox en utilisant indépendamment:

jQuery.colorbox ({href:, iframe: true, l'opacité: 0,6, innerWidth: 760, innerHeight: 420, titre:});

et vous pouvez appeler cette fonction sur un événement comme:.

jQuery ("document") prêt (function() {jQuery.colorbox ..});

Lorsque vous soumettez un formulaire, envoyez un paramètre de requête avec celui-ci. Quand après la soumission, vous retournez le formulaire. voir si ce paramètre est rempli.

puis appelez jQuery.colorbox()

Answer 3

J'ai récemment fait face à ce problème, a passé un certain temps à chercher la solution et trouvé ceci:

$("#submit_button").click(function() { // ATTACH CLICK EVENT TO MYBUTTON 
    $.post("/postback.php",  // PERFORM AJAX POST 
     $("#info_form").serialize(),  // WITH SERIALIZED DATA OF MYFORM 
     function(data){    // DATA NEXT SENT TO COLORBOX 
     $.colorbox({ 
      html: data, 
      open: true, 
      iframe: false   // NO FRAME, JUST DIV CONTAINER? 
     }); 
     }, 
     "html"); 
    }); 

à savoir Colorbox utilise l'envoi du formulaire via les méthodes jQuery standard. J'espère que cela aide quelqu'un.

Answer 4

ici la meilleure réponse ..

Ajouter à votre submitButton: id = "SearchButton"

puis utilisez ceci:

$(document).ready(function() { 
    $("input#SearchButton").colorbox({href: function(){ 
     var url = $(this).parents('form').attr('action'); 
     var ser = $(this).parents('form').serialize(); //alert(url+'?'+ser); 
     return url+'?'+ser; 
    }, innerWidth:920, innerHeight:"86%", iframe:true}); 
}); 

test à: http://wwww.xaluan.com ou http://wwww.xaluan.com/raovat/