Как при выборе даты вызвать код на PHP?

349
31 мая 2017, 05:26

Есть поле type="date" - календарь; и есть код на PHP, который нужно выполнить при выборе даты при помощи Ajax запроса. Как при выборе даты вызвать этот код? Я только начинаю писать и Ajax я не знаю, но если есть хороший пример, напишите, буду разбираться.

Answer 1

Вот пример по которой можете реализовать задуманное вами:

Допустим у вас в коде где то написано ваш input:

<input type="date" name="mydate" id="mydate" />

Если вам нужно что бы ваш код работал после выбора даты то сначала нужно перехватить событие onchage вашего input-а, А патом сделать Ajax запрос на сервер, передавав нужные данные.

Все это сделаем при помощи jQuery:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
$(document).ready(function(){
    $('#mydate').on('change',function(){
        $.ajax({
            type: 'POST',
            url: 'response.php',
            data: 'mydate='+$(this).val(),
            success: function(data){
                //Здесь обрабатываете ответ вашего сервера, а если нечего не нужно сделать можете оставить пустым.
            }
        });
    });
});

Поля ajax запроса обозначают следующее:

type - тип запроса
url - адрес по которой должен идти запрос
data - параметры запроса
success - функция где возвратиться правильный ответ нашего запроса

Теперь давайте рассмотрим серверную часть запроса который в нашем случае будет в файле response.php:

<?php
    $mydate = $_POST['mydate'];
    //Здесь будет ваша логика `php`
    echo `ответ нашего ajax запроса`;
?>

Поскольку мы сделали post запрос, в сервере наши переменные будут в суперглобальном $_POST массиве php;

И после манипуляции с данными мы делаем возврат каких то данных в наш запрос.И это делаеться строкой echo ответ нашего ajax запроса;

Answer 2

Вот простой рабочий вариант, на стороне php к примеру в файле date.php получаете значение даты через $_POST['date'] и делаете с ней что вам надо.

$(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">

READ ALSO
Не срабатывает функция javascript

Не срабатывает функция javascript

Доброго времени! Собствено есть такой код:

221
Как правильно очистить форму во Vue.js?

Как правильно очистить форму во Vue.js?

Подобный вопрос уже был, про сброс формы через метод reset() я знаюВ примерах по работе с Vue

847
Не работает значение времени в hide(), show()

Не работает значение времени в hide(), show()

При использовании метода hide() или show(), страница не обращает внимание на скорость выставленную в круглых скобках, и в результате сразу скрывает...

291
Найти одинаковые значения ключей

Найти одинаковые значения ключей

Помогите с цикломТуплю

349