Puoi usare una combinazione di jQuery e AJAX per farlo. Molto più semplice di quanto sembri. Per vedere che questa è la risposta giusta per te, Guarda solo questo esempio .
Nell'esempio seguente, ci sono due file .PHP:test86a.php e test86b.php.
Il primo file, 86A, ha una semplice casella di selezione (a discesa) e del codice jQuery che controlla la modifica della casella di selezione. Per attivare il codice jQuery, puoi usare jQuery .blur() funzione per controllare che l'utente lasci il campo della data, oppure puoi usare l'API 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");
}
});
Ad ogni modo, quando viene attivato jQuery, viene inviata una richiesta AJAX al secondo file, 86B. Questo file cerca automaticamente le cose dal database, ottiene le risposte, crea del contenuto HTML formattato e echo è tornato al primo file. Tutto ciò avviene tramite Javascript, avviato sul browser, proprio come desideri.
Questi due file sono un esempio indipendente e completamente funzionante. Sostituisci semplicemente gli accessi e il contenuto MYSQL con i tuoi nomi di campo, ecc. e osserva la magia.
TEST86A.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>
TEST86B.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;
Ecco un esempio AJAX più semplice e tuttavia un altro esempio per il check-out.
In tutti gli esempi, nota come l'utente fornisce il contenuto HTML (sia digitando qualcosa o selezionando un nuovo valore di data o scegliendo una selezione a discesa). I dati forniti dall'utente sono:
1) RICEVUTO tramite jQuery:var sel_stud = $('#stSelect').val();
2) quindi INVIATO tramite AJAX al secondo script. (Il $.ajax({}) roba)
Il secondo script utilizza i valori che riceve per cercare la risposta, quindi ECHO che risponde al primo script:echo $r;
Il primo script RICEVE la risposta nella funzione di successo AJAX, quindi (sempre all'interno della funzione di successo) INIETTA la risposta nella pagina:$('#LaDIV').html(whatigot);
Sperimenta con questi semplici esempi:il primo esempio collegato (più semplice) non richiede una ricerca nel database, quindi dovrebbe essere eseguito senza modifiche.
