necesito al hacer click en un boton que me recorra los registros de la tabla html y me los guarde en la base de datos. La funcion "guardar" me carga en la tabla html registros mediante el boton "añadir". Lo que necesito es que con el boton "Guardar Todo" se me inserten todos los registros que ya añadí a la tabla html y se guarden en la base de datos. Este ejemplo lo saque de unas de las preguntas de este gforo pero no me ha funcionado y no entiendo como funciona. Al hacer click en el boton "guardar todo" deberia ejecutarme la funcion "table-2" Este es el codigo que tengo:
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);
}
$('#table-2 tr').each(function () {
var producto = $(this).find('td').eq(0).html();
var cantidad = $(this).find('td').eq(1).html();
var medida = $(this).find('td').eq(2).html();
var fecha = $(this).find('td').eq(3).html();
var turno = $(this).find('td').eq(4).html();
$.ajax({
async: false,
type: "POST",
url: "sql_add_turno_manana.php",
data: "producto=" + producto + "&cantidad=" + cantidad + "&medida=" + medida + "&fecha=" + fecha + "&turno=" + turno,
data: {valores: valores},
success: function (data) {
if (data !== "")
;
}
});
});
<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>
<button id="table-2">Guardar todo</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>
<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>