He creado este sitio e integrado con payfast, funciona bien. pero ahora quiero ejecutar otro script php en el botón de orden de lugar que obtiene detalles en la base de datos. Aquí está mi código bastante largo ... ¡No tengo nada sobre Ajax o javascript! Por favor ayuda
<form id="form1" action="payment.php" method="POST"> some stuff... </form> <?php $htmlForm = '<form action="https://'.$pfHost.'/eng/process" method="post" id="form2">'; $htmlForm .= '<input type="submit" id="submit" name="submit" class="btn btn-primary btn-lg btn-flat" value="PLace Order" onclick="submitForms()"></form>'; ?> <?php echo" ".$htmlForm." </div>"; } else{ echo '...'; } ?> <script> submitForms = function() { document.getElementById("form1").submit(); document.getElementById("form2").submit(); } </script> $(function() { $(".submit").click(function() { var uid = $("#uid").val(); var prodtls = $("#prodtls").val(); var fname = $("#fname").val(); var amnt = $("#amnt").val(); var mail = $("#mail").val(); var dataString = 'uid='+ uid + '&prodtls=' + prodtls + '&fname' +fname + '&amnt' + amnt + '&mail' + mail; if(time=='' || date=='') { $('.success').fadeOut(200).hide(); $('.error').fadeOut(200).show(); } else { $.ajax({ type: "POST", url: "payment.php", data: dataString, success: function(){ $('.success').fadeIn(200).show(); $('.error').fadeOut(200).hide(); } }); } return false; }); });Probé el ajax que encontré pero nunca funcionó. ¡Compruebe al final de mi código! Lo que necesito es que payment.php se ejecute en segundo plano mientras dirige al usuario a payfast
Quiero enviar solo el primero a través de AJAX.
Su intento no tiene mucho sentido porque no parece apuntar al primer formulario (que dice que desea) y es posible que no evite el comportamiento de devolución de datos predeterminado.
Tal como lo entiendo, desea que cualquiera que sea el formulario en el que el usuario haga clic para enviar, el código enviará el primer formulario a través de AJAX y luego el segundo a través de la devolución de datos estándar.
Esto debería hacer el trabajo:
HTML:
<form id="form1" class="doubleForm" action="payment.php" method="post"> <input type="submit" id="submit1" name="submit" class="btn btn-primary btn-lg btn-flat" value="Submit"> </form> <form id="form2" class="doubleForm" action="https://example.com/eng/process" method="post">'; <input type="submit" id="submit2" name="submit" class="btn btn-primary btn-lg btn-flat" value="Place Order"> </form>JavaScript:
//handle submission of both forms $(".doubleForm").submit(function(event) { event.preventDefault(); //stop standard postback var uid = $("#uid").val(); var prodtls = $("#prodtls").val(); var fname = $("#fname").val(); var amnt = $("#amnt").val(); var mail = $("#mail").val(); var dataString = 'uid='+ uid + '&prodtls=' + prodtls + '&fname' +fname + '&amnt' + amnt + '&mail' + mail; if(time == '' || date == '') { $('.success').fadeOut(200).hide(); $('.error').fadeOut(200).show(); } else { //submit first form via AJAX var request = $.ajax({ type: "POST", url: "payment.php", data: dataString }); request.done(function(response) { $('.success').fadeIn(200).show(); $('.error').fadeOut(200).hide(); //now the first form is submitted and server has responded, we can trigger "normal" (non-AJAX) submission of second form document.querySelector("#form2").submit(); }); } });Así que esto realmente funcionó bien usando .serialize() . Gracias @ADyson por el aviso, solo tuve que modificarlo un poco, aunque no tengo experiencia en js
<script type="text/javascript"> $(function(){ $("#submit2").click(function(){ var dataString = $("#form1").serialize(); $.ajax({ type: "POST", url: "payment.php", data: dataString, success: function(data) { alert('Success!'); $("#form1")[0].reset(); } }); }); }); </script>