I’m having trouble identifying the issue with my form submission. Despite my efforts, I can’t figure out why my form isn’t sending the data properly. As a result, the constant formData = new FormData(formu) is empty. I’ve reviewed the code multiple times but still can’t pinpoint the problem. If you could provide any assistance or guidance on this matter, I would greatly appreciate it.
my php:
<?php
include 'config.php';
$sql="SELECT [ID]
,[Cuenta]
,[Vendedor]
,[Nombre]
,[Apellido_1]
,[Apellido_2]
,[Marca]
,[Sucursal]
,[Estado]
FROM [BOT].[dbo].[Maestro_vendedores]
WHERE ESTADO = '1'";
$result = sqlsrv_query( $conexion_db, $sql);
echo '
<table class="table table-hover table-bordered" id="tabla_TraficoVentas" >
<thead>
<tr>
<th height="1%"> Nombre </th>
<th> Marca </th>
<th> Sucursal </th>
<th width="1px"> Estado </th>
<th width="1px"> Modificar </th>
</tr>
</thead>
';
while($row = sqlsrv_fetch_array($result))
{
if($row["Estado"] == 1){
$estado = '<a class="label btn-success text-white f-12" style="padding: 5px 5px; margin: 0px; border-radius: 0.25rem">Activo</a></td>';
}else{
$estado = '<a class="label btn-danger text-white f-12" style="padding: 5px 5px; margin: 0px; border-radius: 0.25rem">Inactivo</a></td>';
}
echo "<tr>";
echo '<td style="vertical-align: middle;"><a class="Nombre" id="nombre_'.$row["ID"].'" data-type="text" data-pk="'.$row["ID"].'" data-url="process.php" data-name="Nombre">'.$row["Nombre"]." ".$row["Apellido_1"]." ".$row["Apellido_2"].'</a></td>';
echo '<td style="vertical-align: middle;"><a class="Marca" id="marca_'.$row["ID"].'" data-type="text" data-pk="'.$row["ID"].'" data-url="process.php" data-name="Marca">'.$row["Marca"].'</a></td>';
echo '<td style="vertical-align: middle;"><a class="Sucursal" id="marca_'.$row["ID"].'" data-type="text" data-pk="'.$row["ID"].'" data-url="process.php" data-name="Sucursal">'.$row["Sucursal"].'</a></td>';
echo '<td style="vertical-align: middle;"><a class="Estado" id="marca_'.$row["ID"].'" data-type="text" data-pk="'.$row["ID"].'" data-url="process.php" data-name="Estado">'.$estado.'</a></td>';
echo '<td style="vertical-align: middle; align: center;"><a data-bs-toggle="modal" data-bs-target="#modificarVendedorModal'.$row["ID"].'" class="btn btn-primary fa fa-pencil text-white" style="padding: 5px 5px; margin: 0px" title="Modificar"></a></td>';
echo "</tr>";
?>
<?php
?>
<div class="modal fade" id="modificarVendedorModal<?php echo $row['ID']?>" data-bs-backdrop="static" data-bs-keyboard="true" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<form id="formularioModVendedor<?php echo $row['ID']?>" action="" method="POST" enctype="multipart/form-data" autocomplete="off">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">
<i class="fa fa-send mr-1"></i>Modificar vendedor
</h5>
<button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
<span>×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<div class="input-group">
<span class="input-group-text form__text">
<i class="fa fa-user"></i>
</span>
<input type="text" name="Nombre" class="form-control" placeholder="Nombre" value="<?php echo $row['Nombre']?>" />
</div>
</div>
<div class="form-row">
<div class="col-sm-6">
<div class="form-group">
<div class="input-group">
<span class="input-group-text form__text">
<i class="fa fa-user"></i>
</span>
<input type="text" name="Apellido_1" class="form-control" placeholder="Apellido Paterno" value="<?php echo $row['Apellido_1']?>"/>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<div class="input-group">
<span class="input-group-text form__text">
<i class="fa fa-user"></i>
</span>
<input type="text" name="Apellido_2" class="form-control" placeholder="Apellido Materno" value="<?php echo $row['Apellido_2']?>" />
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-bs-dismiss="modal">Cancelar</button>
<button type="submit" class="btn btn-primary btn_add" onclick="modificarVendedorA(event, <?php echo $row['ID']?>)">Guardar</button>
</div>
</div>
</form>
</div>
</div>
<?php
}
echo "</table>";
sqlsrv_close($conexion_db)
?>
And my Javascript:
async function modificarVendedorA(event, nroModal) {
try {
event.preventDefault();
// Crear un objeto FormData para enviar los datos del formulario
const formu = document.getElementById("formularioModVendedor" + nroModal);
console.log(formu);
if (formu) {
console.log("Form encontrado");
} else {
console.log("Form NO encontrado");
return;
}
const formData = new FormData(formu);
// Display the key/value pairs for debugging
for (var pair of formData.entries()) {
console.log(pair[0] + ', ' + pair[1]);
}
// Enviar los datos del formulario al servidor usando Axios
const response = await axios.post('acciones/acciones.php?accion=modificarVendedor', formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
});
if (response.status === 200) {
const result = response.data;
console.log('Success:', result);
// Aquí puedes agregar lógica para manejar la respuesta del servidor
toastr.options = window.toastrOptions;
toastr.success("Formulario enviado exitosamente");
} else {
console.log('Network response was not ok.');
toastr.options = window.toastrOptions;
toastr.error("Error al enviar el formulario, intente más tarde");
}
} catch (error) {
toastr.options = window.toastrOptions;
toastr.error("Error al enviar el formulario, intente más tarde");
console.error("Error:", error);
}
}
Retrive the data from the form on the javascript
Dread is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.