Как вызвать php скрипт используя AJAX

Question

Я не совсем понимаю, как работает ajax, особенно "данные" на нем.Я знаю, что ввести в URL и набрать, но в отношении данных я понятия не имею, что туда поместить и что такое данные в AJAX.

Я хочу получить данные из своей базы данных с помощью AJAX, вызывая скрипт php с помощью AJAX.,Я хочу получить даты, которые полностью забронированы, и отключить их в плагине datepicker, который я использовал.

<script type="text/javascript">

       let picker = new Lightpick({
       field: document.getElementById('lightpick-datepicker'),
       minDate: new Date(),
       disableWeekends: true
   });

   let disabledDates = // here ajax request to fetch unavailable dates as array. 
   // for example fetch data has returned that array: 
   // [
   //    ['2019-02-05', '2019-02-11'],
   //    ['2019-02-14', '2019-02-16']
   // ]

   // set to picker unavailable dates
   picker.setDisableDates(disabledDates);

</script>

Это мой код выше, и вот как я думаю, как этот код должен работать, или я ошибаюсь?Я просто не знаю, что туда поставить и как работает AJAX.

Если кто-нибудь действительно решит / поможет мне в этом, не могли бы вы объяснить, как работает вызов php-скрипта ajax?потому что я мог бы часто использовать этот «вызов php-скрипта с использованием AJAX» в моем проекте.

Я попытался найти этот php-скрипт вызова с помощью AJAX.Но они плохо объясняют, как это работает, они только дают коды, хотя коды, которые они дают, не решают мою проблему.

Пробовал этот код ::

<script type="text/javascript">

       let picker = new Lightpick({
       field: document.getElementById('lightpick-datepicker'),
       minDate: new Date(),
       disableWeekends: true
   });

   let disabledDates = ({
        $.ajax({

            url: '/action/get_dates.php';
            type: 'POST';
            data: {} // i dont know that to put here

        });
   )};

   // set to picker unavailable dates
   picker.setDisableDates(disabledDates);

</script>

Answer 1

Привет, вы можете сделать это следующим образом:

первый ваш ajax:

    var id = 1;

    $.ajax({
        method: "POST",
        url: "../script/script.php",
        data: { action: "SLC", id: id}
      }).done(function(response){
console.log(response);
})

ваш php скрипт:

 if (isset($_POST["action"])) {
        $action = $_POST["action"];
        switch ($action) {
            case 'SLC':
                if (isset($_POST["id"])) {
                    $id = $_POST["id"];
                    if (is_int($id)) {
                        echo "is an integer";
                    }
                }
                break;

        }
    }

Где действие - это команда, которую вы хотитесделать SLC, UPD, DEL и т. д., а id - это параметр, если вы хотите работать с json, используйте вместо этого echo json_encode ($ data)

Надеюсь, это поможет

Answer 2

Я рекомендую использовать fetch () или JQuery's $. Ajax ().

fetch(`http://${SERVER_IP}:${SERVER_PORT}/${filename}`, {
    method: "GET",
}).then(resp => response.json())
  .then(respBody => picker.setDisableDates(respBody))

Позвольте мне объяснить:

Первый параметр функции fetch - это url вашего php-скрипта.Предполагая, что ваш сервер работает на том же компьютере, что и ваш клиент (браузер), тогда SERVER_IP = 'localhost'.Если предположить, что вы используете сервер Apache, то, скорее всего, SERVER_PORT = 8080. filename = yourphpscriptname.php.

Второй параметр - это параметр options .Вы должны предоставить метод, используемый в вашем вызове AJAX («GET» | «POST» | «PUT» | «DELETE» | ...).Если ничего не указано, то, я думаю, «GET» будет приниматься по умолчанию.

AJAX-вызовы асинхронны , что означает, что если у вас есть

var a = 10;
fetch(`http://${SERVER_IP}:${SERVER_PORT}/${filename}`, {
    method: "GET",
}).then(respBody => a++)
//will print '10'
console.log(a);

, вывод будетскорее всего, 10, потому что первая строка кода после вашего fetch () будет выполнена до того, как ответ придет с сервера.Код, который вы хотите выполнить при получении ответа, необходимо поместить в then () .

response.json () извлекает тело ответа иззапрос http и преобразует его из json в объект JavaScript.

Кроме того, проверьте совместимость браузера для fetch () function here .

But they explain poorly on how it works they only give codes though the codes they give doesn't solve my problem.

Если мой ответ вам не поможет, вам нужно более четко объяснить, с какой проблемой вы сталкиваетесь.