Puede usar una combinación de jQuery y AJAX para hacer esto. Mucho más simple de lo que parece. Para ver que esta es la respuesta correcta para usted, solo mira este ejemplo .
En el siguiente ejemplo, hay dos archivos .PHP:test86a.php y test86b.php.
El primer archivo, 86A, tiene un cuadro de selección simple (desplegable) y algún código jQuery que vigila que ese cuadro de selección cambie. Para activar el código jQuery, puede usar jQuery .blur() función para ver si el usuario abandona el campo de fecha, o puede usar la API de jQueryUI:
$('#date_start').datepicker({
onSelect: function(dateText, instance) {
// Split date_finish into 3 input fields
var arrSplit = dateText.split("-");
$('#date_start-y').val(arrSplit[0]);
$('#date_start-m').val(arrSplit[1]);
$('#date_start-d').val(arrSplit[2]);
// Populate date_start field (adds 14 days and plunks result in date_finish field)
var nextDayDate = $('#date_start').datepicker('getDate', '+14d');
nextDayDate.setDate(nextDayDate.getDate() + 14);
$('#date_finish').datepicker('setDate', nextDayDate);
splitDateStart($("#date_finish").val());
},
onClose: function() {
//$("#date_finish").datepicker("show");
}
});
En cualquier caso, cuando se activa jQuery, se envía una solicitud AJAX al segundo archivo, 86B. Este archivo busca automáticamente cosas de la base de datos, obtiene las respuestas, crea algún contenido HTML formateado y echo Es volver al primer archivo. Todo esto sucede a través de Javascript, iniciado en el navegador, tal como lo desea.
Estos dos archivos son un ejemplo independiente y completamente funcional. Simplemente reemplace los inicios de sesión y el contenido de MYSQL con sus propios nombres de campo, etc. y observe cómo sucede la magia.
PRUEBA86A.PHP
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
//alert('Document is ready');
$('#stSelect').change(function() {
var sel_stud = $(this).val();
//alert('You picked: ' + sel_stud);
$.ajax({
type: "POST",
url: "test86b.php", // "another_php_file.php",
data: 'theOption=' + sel_stud,
success: function(whatigot) {
//alert('Server-side response: ' + whatigot);
$('#LaDIV').html(whatigot);
$('#theButton').click(function() {
alert('You clicked the button');
});
} //END success fn
}); //END $.ajax
}); //END dropdown change event
}); //END document.ready
</script>
</head>
<body>
<select name="students" id="stSelect">
<option value="">Please Select</option>
<option value="John">John Doe</option>
<option value="Mike">Mike Williams</option>
<option value="Chris">Chris Edwards</option>
</select>
<div id="LaDIV"></div>
</body>
</html>
PRUEBA86B.PHP
<?php
//Login to database (usually this is stored in a separate php file and included in each file where required)
$server = 'localhost'; //localhost is the usual name of the server if apache/Linux.
$login = 'abcd1234';
$pword = 'verySecret';
$dbname = 'abcd1234_mydb';
mysql_connect($server,$login,$pword) or die($connect_error); //or die(mysql_error());
mysql_select_db($dbname) or die($connect_error);
//Get value posted in by ajax
$selStudent = $_POST['theOption'];
//die('You sent: ' . $selStudent);
//Run DB query
$query = "SELECT `user_id`, `first_name`, `last_name` FROM `users` WHERE `first_name` = '$selStudent' AND `user_type` = 'staff'";
$result = mysql_query($query) or die('Fn test86.php ERROR: ' . mysql_error());
$num_rows_returned = mysql_num_rows($result);
//die('Query returned ' . $num_rows_returned . ' rows.');
//Prepare response html markup
$r = '
<h1>Found in Database:</h1>
<ul style="list-style-type:disc;">
';
//Parse mysql results and create response string. Response can be an html table, a full page, or just a few characters
if ($num_rows_returned > 0) {
while ($row = mysql_fetch_assoc($result)) {
$r = $r . '<li> ' . $row['first_name'] . ' ' . $row['last_name'] . ' -- UserID [' .$row['user_id']. ']</li>';
}
} else {
$r = '<p>No student by that name on staff</p>';
}
//Add this extra button for fun
$r = $r . '</ul><button id="theButton">Click Me</button>';
//The response echoed below will be inserted into the
echo $r;
Aquí está un ejemplo de AJAX más simple y, sin embargo, otro ejemplo para que lo compruebes.
En todos los ejemplos, tenga en cuenta cómo el usuario proporciona el contenido HTML (ya sea escribiendo algo, seleccionando un nuevo valor de fecha o eligiendo una selección desplegable). Los datos proporcionados por el usuario son:
1) ATRAPADO a través de jQuery:var sel_stud = $('#stSelect').val();
2) luego ENVIADO a través de AJAX al segundo script. (El $.ajax({}) cosas)
El segundo script usa los valores que recibe para buscar la respuesta, luego ECHOS que responde al primer script:echo $r;
El primer script RECIBE la respuesta en la función de éxito de AJAX y luego (todavía dentro de la función de éxito) INYECTA la respuesta en la página:$('#LaDIV').html(whatigot);
Experimente con estos ejemplos simples:el primer ejemplo vinculado (más simple) no requiere una búsqueda en la base de datos, por lo que debería ejecutarse sin cambios.
