I just want to appear the message after I select the room and time in the drop down buttons. I select all of this, it will appear in the form like this:
$(document).ready(function(){ $('#rooms, #time').bind('input', function() { $('#time_room').val($('#rooms').val() + ' ' + $('#time').val() ); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select name="rooms" id="rooms"> <option value="" style="display: none;">SELECT</option> <option value="cas 104">cas 104</option> <option value="cas 105">cas 105</option> </select> <select name="time" id="time"> <option value="" style="display: none;">SELECT</option> <option value="7:00 - 8:00 am">7:00 - 8:00 am</option> <option value="8:00 - 9:00 am">8:00 - 9:00 am</option> </select> <form action="" name="form"> <input type="text" name="time_room" id="time_room"> </form> <div id="feedback"></div>
The code above was inside of the index.php, then when I put this code inside of it:
$("#feedback").load("check.php").hide();
$("#time_room").on('input', function(){
$.post("check.php", { time_room: form.time_room.value },
function(result){
$("#feedback").html(result).show();
});
});
and inside of the check.php
<?php
$host = "localhost";
$user = "root";
$password = "";
$database = "subject_loading_for_csit";
$con = mysqli_connect($host, $user, $password, $database) or die ("could not connect");
if (mysqli_connect_errno()) {
echo "connection failed:".mysqli_connect_error();
exit;
}
$rmt = $_POST['time_room'];
$query = mysqli_query($con, "SELECT * FROM subject_scheduled where room_time = '$rmt' ");
$count = mysqli_num_rows($query);
if ($count == 0) {
echo "OK";
}else if($count > 0){
echo "Already taken";
}?>
This codes works but eventually, the message won't shown up unless I try to insert or edit the form.
#time_room
's 'input' event will fire only on manual input, not when its value is set by javascript/jQuery.
There seems to be no point in attaching an event handler to #time_room
as its value will (or should) only ever change in response to #rooms
and #time
being changed.
You need to cause $.post(...)
to be called when either #rooms
or #time
is changed.
$(document).ready(function() {
$('#rooms, #time').on('change', function() {
var time_room_value = $('#rooms').val() + ' ' + $('#time').val();
$('#time_room').val(time_room_value);
$.post('check.php', { 'time_room': time_room_value }, function(result) {
$("#feedback").html(result).show();
});
});
// $("#feedback").load('check.php').hide(); // no point loading a message that will not be seen?
$("#feedback").hide();
});
Note, I changed input
to the more usual change
event.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.