How do I call the PHP code when selecting a date?
There is a field type="date" - calendar; and there is a code in PHP that must be executed when selecting a date using the Ajax query. How do I call this code when selecting a date? I am just starting to write and I do not know Ajax, but if there is a good example, write it, I will understand.
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('#CallTime').on('change',function(){
$.ajax({
type: 'POST',
url: 'index.php',
data: 'CallTime='+$(this).val(),
success: function(data){
}
});
});
});
</script>
<?php
if (!empty($_POST['CallTime']))
{
$t = '<select name="time">';
$t .= '<option value="">1</option>';
$t .= '</select>';
echo $t;
}
?>
<form action="" method="POST">
<p>Выберите дату:</p>
<input type="date" name="CallTime" id="CallTime">
<input type="submit" value="Ок">
</form>
</body>
</html>
$obj = json_decode($json, true);
foreach($obj['Intervals'][$b] as $a)
{
if ($a['State'] == 0)
{
$t .= '<option value="'.$a['StartTime'].'">'.$a['StartTime'].'</option>';
}
}
echo $t;
2 answers
Here is an example of how you can implement your plan:
Let's say you have your input written somewhere in your code:
<input type="date" name="CallTime" id="CallTime" />
<select name="time" id="times_option"><option>select</option></select>
If you need your code to work after selecting the date, you first need to intercept the onchage event of your input-a, and then make a Ajax request to the server, passing the necessary data.
We will do all this using jQuery:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
$(document).ready(function(){
$('#CallTime').on('change',function(){
$.ajax({
type: 'POST',
url: 'response.php',
data: 'CallTime='+$(this).val(),
success: function(data){
$('#times_option').append(data);
}
});
});
});
The ajax fields of the request indicate the following:
type - тип запроса
url - адрес по которой должен идти запрос
data - параметры запроса
success - функция где возвратиться правильный ответ нашего запроса
Now let's look at the server side the request that in our case will be in the file response.php:
<?php
if (!empty($_POST['CallTime']))
{
$t = '<option value="">1</option>';
echo $t;
}
?>
Since we made the post request, in the server, our variables will be in the superglobal $_POST array php;
And after manipulating the data, we return some data to our request.And this is done by the string echo ответ нашего ajax запроса;
Here is a simple working version, on the php side, for example, in the date.php file, you get the date value through $_POST['date'] and do what you need with it.
$(document).on('change', '.date-picker', function(event) {
console.log('Выбрана дата:' + $(this).val());
// Отправляем запрос
$.ajax({
url: '/date.php',
type: 'POST',
dataType: 'json',
data: {date: $(this).val()},
})
.done(function(response) {
console.log("Всё хорошо, сервер вернул ответ");
})
.fail(function() {
console.log("Что-то на сервере не так");
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" class="date-picker">