How can I do it dynamic? if I have 3 forms the first one receives it without problem but the other two do not receive them
data: new FormData($("#guardar")[0]);
How can I do it dynamic? if I have 3 forms the first one receives it without problem but the other two do not receive them
data: new FormData($("#guardar")[0]);
You have to cycle your forms. You can make an arrangement of forms with their respective IDs, or you can give them a class to everyone and cycle the class.
I'll give you an example cycling the class.
//Event cuando de click al botón
$(document).on('click','#btn',function(){
var arr = [];
//Recorremos todos los formularios
$('.forms').each(function(){
//Saca el formData del formulario actual
arr.push( {data: new FormData( $(this) )} );
});
console.log( arr );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="forms" method="POST" action="foo.php">
<input type="text" name="foo">
</form>
<form class="forms" method="POST" action="bar.php">
<input type="text" name="bar">
</form>
<form class="forms" method="POST" action="poo.php">
<input type="text" name="poo">
</form>
<input type="button" value="Guardar todos" id="btn">
now in the button I put the parameter of the form ID in this case is save1, in the other would be save2
<button type="button" id="2" onclick="guardar('<?php echo 'guardar1'?>','<?php echo base64_encode('guardar')?>');">Guardar</button>
function guardar(g,f){
$(".loader").fadeIn("fast", function(){
$.ajax({
url: 'index.php?f='+f,
data: new FormData($("#"+g)[0]),
type: 'post',
cache:false,
contentType: false,
processData: false,
success: function(resultado){
if(resultado === "OK"){
$("#pMensajeCorrecto").html("Registro guardado");
$("#divMensajeCorrecto").show();
modalPrincipal.modal("hide");
setTimeout(function(){cerrar("divMensajeCorrecto");}, 3000);
$('#tabla').click();
$(window).scrollTop(0);
}
else{
$("#pMensajeModal").html(resultado);
$("#divMensajeModal").show();
setTimeout(function(){cerrar("divMensajeModal");}, 3000);
$("#divGuardar").scrollTop(0);
}
$(".loader").fadeOut("fast");
},
});
});
}