hola tengo un problema el cual me tiene ocupado desde hace tiempo y no he podido resolver. resulta que estoy llamando contenido de mis tablas(mysql) por medio de ajax para no recargar la pagina. todo perfecto hasta este punto. el problema es que no se como pasarle una variable a esa consulta generada con ajax para que el contenido de mi tabla se muestre dependiendo el valor de la variable.
vamos por parte para que se entienda Mi pagina contiene una sección de proyectos, y al seleccionar un proyecto me envía a otra pagina donde se muestra todo los contenidos de ese mismo proyecto. lo que yo pretendo es pasar a la consulta que me muestra el contenido de mis tablas el id del proyecto en cuestión.
lo que tengo echo es que me muestra el contenido de todos los proyectos y yo solo quiero, el de el proyecto que se elije.
empezare con la pagina principal: index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!---JQUERY--->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
</head>
<body>
<!--- el siguiente formulario es invisible y es el encargado de
contener el id de mi proyecto el cual se ejecuta automáticamente
cuando carga la pagina por primera vez y se envía el valor de el
input a la pagina encargada de la consulta de la tabla--->
<script>
window.onload = function(){
document.getElementById('envIdPro').click();
}
</script>
<form id="formVarProyecto">
<input id="enviandoIdPro" type="number" value="<?php echo $idProyectos?>" style="visibility: hidden;width:0px;height:0px;">
<input type="submit" id="envIdPro" style="visibility: hidden;width:0px;height:0px;">
</form>
<!---//////////////la tabla que muestra los materiales de ese proyecto////////////////--->
<table id="tablaMaterialesProyecto" class="tablaInsumos">
<thead>
<tr>
<th title="Nombre Material" style="visibility: hidden;width:0px;">id</th>
<th title="Nombre Material">MATERIAL</th>
<th title="Marca Material">MARCA</th>
<th title="Modelo de el Material">MODELO</th>
<th title="Unidad de Medida de el Material">MEDIDA</th>
<th title="Cantidad de Material Asignada al proyecto">CANTIDAD</th>
<th title="Valor de El material Por Unidad de medida">VALOR</th>
<th title="Valor Total Por Cantidad de Materiales">TOTAL</th>
<th title="Valor Total Por Cantidad de Materiales">ACCIONES</th>
</tr>
</thead>
<tbody id="tasks"><!---el contenido lo paso por ajax a traves del id de el tbody--->
</tbody>
</table>
<script src="app.js"></script><!---este es el archivo ajax que ejecuta todo sin recargar la pagina-->
</body>
</html>
ahora el archivo ajax llamado app.js
$(document).ready(function() { //función que se ejecuta automáticamente junto con idex
enviaVariable(); //envío el formulario apenas se cargue la pagina con el id
fetchTasks();//ejecutando esta función se cargar la tabla apenas cargue index.php//
// llenar tabla materiales
function fetchTasks() {
/*se guarda todo en una función para cuando agreguemos algo se recargue al pulsar el botón de guardar*/
$.ajax({
url: 'tablaMateriales.php',
type: 'GET',
success: function(response) {
const tasks = JSON.parse(response);
let template = '';
tasks.forEach(task => {
template += `
<tr taskId="${task.IDM}">
<td style="visibility: hidden;width:0px;">${task.IDM}</td>
<td>${task.Material}</td>
<td>${task.Marca}</td>
<td>${task.Modelo}</td>
<td>${task.Medida}</td>
<td>${task.Unidades}</td>
<td>${task.Valor}</td>
<td>${task.Total}</td>
<td>
<button title="Eliminar" class="Eliminar-Materiales btn btn-danger btn-sm">
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
`
});
$('#tasks').html(template);
}
});
}
//función encargada de enviar formulario automáticamente al cargar la pagina
function enviaVariable(){
$('#formVarProyecto').submit(function(e){
const postData5 = {
idPro : $('#enviandoIdPro').val(),
}
$.post('tablaMateriales.php', postData5, function(response){
});
e.preventDefault();
});
}
});
ahora el archivo donde se ejecuta la consulta llamado tablaMateriales.php vuelvo a decir que me funciona el de cargar la tabla pero cuando le paso la condición where
y el id de mi proyecto no la carga... el problema es que no me funciona mi manera de enviar la variable que contiene el id del proyecto
<?php
include '../conexionDB/db.php';
$idProyecto = $_POST['idPro']; /*aquí recibo la variable enviada por el formulario */
$query = "SELECT * from vista_materiales_consumidos WHERE idProyecto =$idProyecto";
$result = mysqli_query($conexion, $query);
if(!$result) {
die('Query Failed'. mysqli_error($conexion));
}
$json = array();
while($row = mysqli_fetch_array($result)) {
$json[] = array(
'IDM' => $row['IDM'],
'Material' => $row['Material'],
'Marca' => $row['Marca'],
'Modelo' => $row['Modelo'],
'Medida' => $row['Medida'],
'Unidades' => $row['Unidades'],
'Valor' => $row['Valor'],
'Total' => $row['Total']
);
}
$jsonstring = json_encode($json);
echo $jsonstring;
?>
espero alguien me ayude me tiene preocupado este tema
data
jQuery ajax() W3Schools