Hola a todos, mi nombre es Erik y estoy empezando a programar en PHP y MySQL, para mi es algo muy nuevo y estoy agarrandole la forma.
Programo de toda la vida en delphi aplicaciones de escritorio, pero por cuestiones laborales requiero poder implementar algunas consultas en PHP y MySQL para poder acceder desde los exploradores de internet.
Ya tengo mi diseño base:
- Me conecto a mi base de datos
- Hago una consulta MySQL desde el inicio de la carga de la pagina, y muestro el resultado en una grid o rejilla, implementando Bootstrap por supuesto
- Se paginan los datos
- Utilizo el buscador que incluye bootstrap y funciona (El codigo me base en un CRUD que busque en internet y lo adapte extrayendo solo la parte que utilizo)
El detalle es que utilizando JQuery Agrege un Panel Accordion para cargar 3 cajas de texto (Nombre, ApellidoPaterno, ApellidoMaterno), no se como crear la consulta sin recargar la pagina (para eso supongo debo de hacerlo en jQuery) para que lea los valores de las 3 cajas de texto y al presionar el boton de buscar extraiga los valores y los inserte en la query que utilizo, se que puede ser algo muy sencillo pero no logro hacerlo, e leido varios ejemplos buscado informacion pero no lo consigo o todos los ejemplos que encuentro son del 2012 o 2013 donde la conexion ya no es compatible porque utilizan mysql y no mysqli o PDO
Les expongo mi codigo para ver si me pueden hechar una mano saludos:
Código PHP:
Ver original<!DOCTYPE html>
<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SISTEMA DE CONSULTA</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/dataTables.bootstrap.css" rel="stylesheet">
<script src="js/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
</head>
<body>
<div class="container">
<div class="panel panel-primary">
<div class="panel-heading">SISTEMA DE CONSULTA</div>
<div class="panel-body">
<?php
include "config.php";
?>
<div class="panel panel-default">
<div class="panel-body">
<div id="accordion">
<h3>Busqueda Completa</h3>
<div>
<form role="form">
<div class="form-group">
<input type="text" class="form-control input-sm" id="xNombre" placeholder="Nombre">
</div>
<div class="form-group">
<input type="text" class="form-control input-sm" id="xApelloPaterno" placeholder="Apellido Paterno">
</div>
<div class="form-group">
<input type="text" class="form-control input-sm" id="xApelloMaterno" placeholder="Apellido Materno">
</div>
<button type="submit" class="btn btn-primary btn-lg btn-block">Buscar</button>
</form>
</div>
</div>
</div>
</div>
<script>
$( "#accordion" ).accordion({
active: false,
collapsible: true,
autoHeight: false,
heightStyle: "content",
});
</script>
<table id="ghatable" class="display table table-responsive table-bordered table-hover table-condensed table-striped" cellspacing="0" width="100%">
<thead>
<tr>
<th class="active">ID</th>
<th class="active">NOMBRE</th>
<th class="active">APELLIDO PATERNO</th>
<th class="active">APELLIDO MATERNO</th>
<th class="active">OPCIONES</th>
</tr>
</thead>
<tbody>
<?php
$mysqli->query("SET NAMES 'utf8'");
$res = $mysqli->query("SELECT ID, NOMBRE, APELLIDOPATERNO, APELLIDOMATERNO,SEXO FROM maindb LIMIT 1000");
while ($row = $res->fetch_assoc()):
?>
<tr>
<td><?php echo $row['ID'] ?></td>
<td><?php echo $row['NOMBRE'] ?></td>
<td><?php echo $row['APELLIDOPATERNO'] ?></td>
<td><?php echo $row['APELLIDOMATERNO'] ?></td>
<td>
<center><a target="_blank" href="#"><span class="glyphicon glyphicon-list-alt" aria-hidden="true"></span> MOSTRAR</a></center>
</td>
</tr>
<?php
endwhile;
?>
</tbody>
</table>
</div>
</div>
</div>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<script src="js/dataTables.bootstrap.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#ghatable').dataTable();
});
</script>
</body>
</html>
Mi archivo config.php de conexion es el siguiente:
Código PHP:
Ver original<?php
$mysqli = new mysqli("localhost", "root", "", "test");
if ($mysqli->connect_errno) {
echo "Failed to connect to MySQL: " . $mysqli->connect_error;
}
?>