Подскажите, пожалуйста, по ajax

Question

Есть ajax запрос

    $.ajax({
    type: "POST",
    url: arAsproOptions["SITE_DIR"] + "ajax/item.php",
    data: basketParams,
    dataType: "json",
    success: function (data) {
      if ("STATUS" in data) {
        if (data.STATUS !== "OK") {
          showBasketError(BX.message(data.MESSAGE) + " <br/>" + data.MESSAGE_EXT);
        }

        //js notice
        if (typeof JNoticeSurface !== "undefined") {
          switch (action) {
            case "buy":
              JNoticeSurface.get().onAdd2cart(itemsAll);
              break;
            case "wish":
              JNoticeSurface.get().onAdd2Delay(itemsAll);
              break;
            case "compare":
              JNoticeSurface.get().onAdd2Compare(itemsAll);
              break;
            default:
              console.log("nothing");
          }
        }
        //

        if ($(".header-cart.fly").length) {
          arBasketAsproCounters.DEFAULT = true;
          SetActualBasketFlyCounters(true);
        } else {
          if ($("#ajax_basket").length) {
            reloadTopBasket("add", $("#ajax_basket"), 200, 5000, "N", "", true);
          } else {
            reloadBasketCounters("", true);
          }
        }
      }
      _this.parent().removeClass("loadings");
      $(".opt_action").removeClass("no-action");
    },
  });

И есть мой код на php, в котором я хочу передать похожий запрос, отдельной функцией, CustomEvent . При нажатии кнопки я получаю в консоле ошибку CustomEvent not defined. Проблема в том, что я не пойму как это все работает в js.

        <?foreach($data as $item){?>
    <div class="item"><input <?=$item['CHECKED']?> type="checkbox" id="serv_<?=$item['ID']?>" onchange="CustomEvent(<?=$item['ID']?>)" /> <label for="serv_<?=$item['ID']?>"><?=$item['NAME']?></label> - <span class="price"><?=round($item['PRICE']['PRICE'])?> руб.</span></div>
    <?}?>

переменная $data это массив

$data = [
'PRODUCT_ID' => $id,
'PRICE' => $price['PRICE']];

Answer 1

Приложения, которые работаю через интернет, выстраиваются по принципе клиент-серверной архитектуры. Между собой они общаются только запросами, но клиент не имеет данных сервера и сервер не имеет данных клиентов.

На клиенте у вас выступает браузер и он понимает только HTML+CSS+JavaScript. На сервере у вас выполняется ваша PHP программа и результат её выполнения подставляется в отдаваемый HTML документ. Таким образом клиент ничего не знает о PHP коде и его просто там нет.

клиент-серверная архитектура https://habr.com/ru/post/495698/

Сейчас ваш код отдает на клиент документ HTML с примерно таким содержанием (можно посмотреть через консоль разработчика в браузере на вкладке с html):

<div class="item">
    <input checked type="checkbox" id="serv_1" onchange="CustomEvent(1)"/> 
    <label for="serv_1">Имя</label> - <span class="price"> 100 руб.</span>
</div>

Проблема в том, что ни о каком CustomEvent в php, который на сервере, браузер не знает и не имеет к нему доступа. Поэтому только два варианта вам доступны.

Либо вы сразу формируете в документе нужные данные onchange="<?= CustomEvent($item['ID']) ?>" и php выполнит функцию и подставит в документе до того, как отдаст результат клиенту.
Либо если вам нужна реакция на события от пользователя и обработать их, то формируете отдельный запрос на сервер, получаете данные от сервера и подставляете их в документ. Если страница не должна при этом перезагружаться, то такой запрос можно сформировать только JS (поскольку только он на клиенте есть) и для этого и существует AJAX.

Как я понимаю, вам нужно будет использовать второй вариант и писать отдельный запрос из JS к серверу через какой-нибудь JQuery Ajax или JS Fetch API.

БЛОГ НА HUSL

Подскажите, пожалуйста, по ajax

Ответы (1 шт):