It happens that I am creating a temporary table, the data that I am registering in the same I will pass them to an array (miArray) in js to be able to send them through AJAX to a PHP and then save them to a database. Function of Javascript
function guardardatos(){
console.log(JSON.stringify(miArray));
var myJsonString = JSON.stringify(miArray);
$.ajax({
url:'Conexion/Guardar.php',
type:'POST',
data:myJsonString,
dataType: 'json',
}).done(function(resp){
console.log(resp);
}).fail(function(resp){
console.log(resp.responseText);
});
}the variable myJsonString the data that compose it are from the array that I had indicated. When I show it by console it gives me this result
[{"idarticulo":1,"cantidad":"12","nombre":"AZUCAR BLANCO","precio":"0.30","resultado":3.6}]
I checked it in a page to verify if it was in the correct syntax of json and it indicated to me that yes.
The problem is that when you go to the page Guardar.php and make a echo json_encode($_POST); it returns me by console that the array is empty. Any idea why is not the data going to my PHP?
The PHP where the page of the table is:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<?php require_once("Vista/Head.php");
require_once("validarsession.php");
require_once("Conexion/Conexion.php");
?>
</head>
<body>
<?php require_once("Vista/Header.php");?>
<div class="container-fluid">
<div class="row">
<div class="col-lg-12">
<h1 class="page-header" style="text-align:center;">Realizar Compras</h1>
</div><!-- /.col-lg-12 -->
</div>
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6 table-responsive">
<div class="panel panel-default panel-table panel-success">
<div class="panel-heading">
</div>
<div class="panel-body">
<div class="container-fluid">
<div class="panel panel-default">
<div class="panel-heading">
<h4>Datos del producto</h4>
</div>
<div class="panel-body">
<div class="row" style="padding:20px;">
<label for="">Busqueda:</label>
<select class="selectpicker show-menu-arrow form-control" data-live-search="true" title="------" id="producto">
<?php
$class = new conexion();
$var = $class->CargarArticulos();
foreach ($var as $key => $value) {
echo "<option value=".$value['IDARTICULO'].">".$value['ARTNOMB']."</option>";
}
?>
</select>
</div>
<div class="row" style="padding:20px;">
<label for="">Cantidad:</label>
<input class="form-control" type='text' onKeyPress='return soloNumeros(event)' id="cantidad"/>
</div>
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6"><input type="button" name="" value="Agregar" class="form-control btn btn-success" onclick="Cargar()"></div>
<div class="col-md-3"></div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4>Detalle Carro de compras</h4>
</div>
<div class="panel-body">
<div class="row table-responsive" style="padding:20px;">
<form class="" action="" id="form_insert">
<table class="table table-bordered table-hover table-condensed table-fixed display table-responsive table-condensed" id="miTabla">
<thead>
<th scope="col" style="display:none;"><center>IDARTICULO</center></th>
<th scope="col"><center>Cantidad</center></th>
<th scope="col"><center>Nombre</center></th>
<th scope="col"><center>Precio Cost.</center></th>
<th scope="col"><center>Precio Total</center></th>
<th scope="col"><center>Accion</center></th>
</thead>
<tbody id="tablita">
</tbody>
</table>
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6"><input type="button" name="" value="Comprar" class="form-control btn btn-success" onclick="guardardatos()"></div>
<div class="col-md-3"></div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3"></div>
</div>
<br>
<br>
</div>
<?php require_once("Vista/Footer.php"); ?>
</script>
</body>
</html>and the Javascript that I use to fill the table and store the results:
<script type="text/javascript">
var miArray = [];
function Cargar(){
var _producto = document.getElementById("producto").value;
var _cantidad = document.getElementById("cantidad").value;
var select = document.getElementById("producto"), //El <select>
value = select.value, //El valor seleccionado
text = select.options[select.selectedIndex].innerText; //El texto de la opción seleccionada
var _encontradoResultado=false;
//realizamos el recorrido solo por las celdas que contienen el código, que es la primera
$("#miTabla tr").find('td:eq(2)').each(function () {
codigo = $(this).html();
if(codigo==text){
_encontradoResultado=true;
}
})
if (!_producto == "" && _encontradoResultado == false) {
$.ajax({
url:'Conexion/Buscar.php',
type:'POST',
dataType: 'json',
data:'IDARTICULO='+_producto
}).done(function(resp){
var fila;
for (var i = 0; i < resp.length; i++) {
var flotante = parseFloat(resp[i].Precio*_cantidad);
var resultado = Math.round(flotante*100)/100;
fila ="<tr><td align='center' style='display:none; '>"+resp[i].IDARTICULO+"</td> <td align='center'>"+_cantidad+"</td> <td align='center'>"+resp[i].ARTNOMB+"</td> <td align='center'>"+resp[i].Precio+"</td> <td align='center'>"+resultado+"</td> <td align='center'><input type='button' class='borrar btn btn-danger' value='Eliminar' /></td></tr>";
miArray.push({idarticulo: resp[i].IDARTICULO, cantidad:_cantidad,nombre:resp[i].ARTNOMB,precio:resp[i].Precio,resultado:resultado});
}
var btn = document.createElement("TR");
btn.innerHTML=fila;
document.getElementById("tablita").appendChild(btn);
});
}
}
</script>