Tengo esta tabla html
donde al hacer click en el botón "Guardar Todo" la recorro y necesito insertar todos los datos en una base de datos. El recorrerla y traer los datos; lo hace bien; pero no sé cómo hacer el POST de esos datos para poder insertarlos en la base de datos. Realizo un console.log($(this).text());
que me trae bien los datos que están en la tabla html
y me los muestra en la consola. Aca abajo agrego el código html
y el script de mi archivo y además agrego el código del archivo donde intento hacer el POST y el insert. Alguna solución? Desde ya muchas gracias.
$("#b2").click(function () {
$("td").each(function () {
console.log($(this).text());
var producto = $(this).find('td').eq(0).val();
var cantidad = $(this).find('td').eq(1).val();
var medida = $(this).find('td').eq(2).val();
var fecha = $(this).find('td').eq(3).val();
var turno = $(this).find('td').eq(4).val();
$.ajax({
async: false,
type: "POST",
url: "leer_tabla.php",
data: "producto=" + producto + "&cantidad=" + cantidad + "&medida=" + medida + "&fecha=" + fecha + "&turno=" + turno,
success: function () {
alert('listo');
}
});
});
});
function guardar() {
var producto = $('select[name="producto"] option:selected').text();
var cantidad = document.getElementById("cantidad").value;
var medida = $('select[name="medida"] option:selected').text();
var fecha = document.getElementById("fecha").value;
var turno = document.getElementById("turno").value;
var fila = "<tr><td>" + producto + "</td><td>" + cantidad + "</td><td>" + medida + "</td><td>" + fecha + "</td><td>" + turno + "</td></tr>";
var btn = document.createElement("TR");
btn.innerHTML = fila;
document.getElementById("tablita").appendChild(btn);
}
<div class="row">
<div class="col-md-4 col-md-offset-4" id="register_form">
<!-- Form Name -->
<legend>Vender Producto</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label" for="textinput">Producto</label>
<div class="col-sm-10">
<select class="form-control" name="producto" id="producto" required>
<option disabled selected value ></option>
<?php
$clavebuscadah = mysql_query("select productos.id_prod, productos.prod_nomb, unidad_medida.unme_nomb FROM productos INNER JOIN unidad_medida ON productos.id_unid_medi=unidad_medida.id_unid_medi ORDER BY prod_nomb ASC", $link) or
die("Problemas en el select:" . mysql_error());
while ($row = mysql_fetch_array($clavebuscadah)) {
echo'<OPTION VALUE="' . $row['id_prod'] . '">' . $row['prod_nomb'] . ' {' . $row['unme_nomb'] . '} </OPTION>';
//$categoria = $row['cate_nomb'];
}
?>
</select>
</div>
</div><br>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label" for="textinput">Cantidad</label>
<div class="col-sm-4">
<input type="text" name="cantidad" id="cantidad" class="form-control">
</div>
<label class="col-sm-2 control-label" for="textinput">Un.Medida</label>
<div class="col-sm-4">
<select class="form-control" name="medida" id="medida" required>
<option disabled selected value ></option>
<?php
$clavebuscadah = mysql_query("select * from unidad_medida", $link) or
die("Problemas en el select:" . mysql_error());
while ($row = mysql_fetch_array($clavebuscadah)) {
echo'<OPTION VALUE="' . $row['id_unid_medi'] . '">' . $row['unme_nomb'] . ' </OPTION>';
//$categoria = $row['cate_nomb'];
}
?>
</select>
</div>
</div><br>
<!-- Text input-->
<div class="form-group">
<label class="col-sm-2 control-label" for="textinput">Fecha</label>
<div class="col-sm-4">
<input class="form-control" id="fecha" type="date" value="<?php echo date('Y-m-d') ?>" disabled>
</div>
<label class="col-sm-2 control-label" for="textinput">Turno</label>
<div class="col-sm-4">
<input class="form-control" id="turno" value="MAÑANA" type="text" disabled>
</div>
</div><br>
<button id="btn_guardar" onclick="guardar()">Añadir</button><br><br>
</div>
</div>
<div class="container">
<div class="row">
<div class="panel panel-primary filterable">
<div class="panel-heading">
<h3 class="panel-title">Listado de Productos Vendidos</h3>
<div class="pull-right">
<button class="btn btn-default btn-xs btn-filter"><span class="glyphicon glyphicon-filter"></span> Filtro</button>
</div>
</div>
<div class="table-wrapper-scroll-y">
<table id="table-2" class="table table-hover ">
<style>
.table-wrapper-scroll-y {
display: block;
max-height: 250px;
overflow-y: auto;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
</style>
<button id="guardar-table-2">Guardar todo</button><br><br>
<input class="btn btn-primary" id="guardar-table-2" value="Guardar Registro" type="submit" name="submit">
<thead>
<tr class="filters">
<th><input type="text" class="form-control" placeholder="Nombre" disabled></th>
<th><input type="text" class="form-control" placeholder="Cantidad" disabled></th>
<th><input type="text" class="form-control" placeholder="Unidad de medida" disabled></th>
<th><input type="text" class="form-control" placeholder="Fecha" disabled></th>
<th><input type="text" class="form-control" placeholder="Turno" disabled></th>
<th><input type="text" class="form-control" placeholder="Acciones" disabled></th>
</tr>
</thead>
<tbody id="tablita">
</tbody>
</table>
</div>
</div>
</div>
</div>