The following function searches all the questions and answers that have been generated in a table in a dynamic way to carry out a questionnaire of x number of questions with x number of answers.
However, when we want to pass the object to a php file with formData using POST. This prints an empty array on the server side even though the console prints the array correctly.
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Preguntas</th>
<th>Respuestas</th>
<th>Acción</th>
</tr>
</thead>
<tbody id="bodyTablaEncuesta">
</tbody>
</table>
function addPregunta(){
var preguntaEncuesta=$('#preguntaEncuesta').val();
var inputs = $("#divinputsRespuestas").find("input");
var respuestas = "";
var respuestasArray= new Array();
$.each(inputs.serializeArray(), function(_, field) {
respuestas += field.value + "<input type='hidden' name='respuestas' value='"+field.value+"'><br>";
respuestasArray.push(field.value);
});
pregunta.push([{'pregunta':preguntaEncuesta},{'respuestas':respuestasArray}]);
$('#bodyTablaEncuesta').append(
'<tr>'+
'<th scope="row">1</th>'+
'<td>'+preguntaEncuesta+'<input type="hidden" name="preg" value="'+preguntaEncuesta+'"></td>'+
'<td>'+respuestas+'</td>'+
'<td><a type="submit" class="btn btn-default" onclick="borrar(this);"><spam class="glyphicon glyphicon-trash"></spam></a></td>'+
'</tr>');
//console.log(pregunta);
}
function agregarMuestreo(){
var content = new Array();
$("#bodyTablaEncuesta tr").each(function(){
var aux = new Array();
aux['p']=($(this).find("input[name=preg]").val());
aux['r']= new Array();
$(this).find("input[name=respuestas]").each(function(){
aux['r'].push($(this).val());
});
content.push(aux);
});
console.log("final:");
console.log(content);
var formData = new FormData(document.getElementById('us'));
formData.append("content",content);
$.ajax({
dataType: 'json',
data: formData,
url: 'php/agregarMuestreo.php',
type: 'POST',
contentType: false,
cache:false,
processData: false,
beforeSend: function(){
$('#resultado').html('<div class="alert alert-info" role="alert">Ingresando, espere por favor</div>');
},
success:function(data){
if (data=='1') {
$('#resultado').html('<div class="alert alert-success" role="alert">Los datos fueron agregados correctamente</div>');
$('#us')[0].reset();
vpb_pagination_system('1');
}else {
$('#resultado').html(data);
}
}
});
}
On the server side, we only print the data with:
print_r($_POST);