Ajax, json, jquery. Не происходит добавление товара в корзину.

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Добрый день!
При попытке нажать на ссылку "Добавить в корзину", текст "Добавить в корзину" должен исчезать, а напротив ссылки "В корзине" должно появляться количество товара в корзине. Ни того, ни другого не происходит.
Ошибка в консоли Хрома появляется сразу, когда попадаешь на главную страницу сайта и никуда не исчезает, на какую бы страницу не переходил. Насколько понимаю, не подключается скрипт jquery-3.5.1.min.js и созданный скрипт main.js.
В консоли эта ошибка выглядит так:

Проблема с выводом из корзины..JPG


Эти скрипты подключаются в шаблоне header.tpl, который выглядит так:
HTML:
<html>
<head>
    <title>{$pageTitle}</title>
    <link rel="stylesheet" href="{$TemplateWebPath}css/main.css" type="text/css"/>
    <script src="/www/js/jquery-3.5.1.min.js" type="text/javascript"></script>
    <script src="/www/js/main.js" type="text/javascript"></script>
</head>
<body>
<div id="header">
    <h1>my shop - интернет магазин</h1>
</div>


{include file='leftcolumn.tpl'}

<div id="centerColumn">
Phpshtorm не показывает, что эти файлы не найдены... Они находятся в следующей директории:
Скрипты в жёстком диске..JPG


Файл main.js:

JavaScript:
/**
*  Функция добавления товара в корзину
*
*  @param integer itemId ID продукта
*  @return в случае успеха обновятся данные корзины на странице
*/
function addToCart(itemId) {
    console.log("js - addToCart()");
    $.ajax({
        type: 'POST',
        async: true,
        url: "cart/addtocart" + itemId + '/',
        dataType: 'json',
        success: function (data) {
            if(data['success']){
                $('#cartCntItems').html(data['cntItems']);

                $('#addCart_'+ itemId).hide();
                $('#removeCart_'+ itemId).show();
            }
        }

        });
}
Когда находишься на странице конкретного товара и нажимаешь "Добавить в корзину", то к вышеупомянутой ошибке в консоли добавляется ещё одна: Uncaught SyntaxError: Unexpected token '<'
Проблема с корзиной (2)..JPG

Но тэги '<' открывающий и '>' закрывающий существуют в коде.
Если тут нажать на ?controller=product&id=12:58, то появится такое окно:

Проблема с корзиной (3)..JPG


Файл product.tpl:
HTML:
{* страница продукта*}
    <h3>{$rsProduct['name']}</h3>

    <img width="575" src="../www/images/products/{$rsProduct['image']}">
    Стоимость: {$rsProduct['price']}

    <a id="addCart_{$item['id']}" alt="Добавить в корзину" onclick="addToCart({$item['id']}); return false;" href="#">Добавить в корзину</a>
    <p> Описание <br />{$rsProduct['description']}</p>
Ещё файл CartController.php:
PHP:
<?php

/**
* cartController.php
*
* Контроллер работы с корзиной (/cart/)
*
*/

// подключаем модели
include_once '../models/CategoriesModel.php';
include_once '../models/ProductsModel.php';


/**
* Добавление продукта в корзину
*
* @param integer id GET параметр - ID добавляемого продукта
* @return json информация об операции (успех, кол-во элементов в корзине)
*/
  function addtocartAction() {
      $itemId = isset($_GET['id']) ? intval($_GET['id']) : null;
      if(! $itemId) return false;

      $resData = array();

      // если значение не найдено, то добавляем
      if(isset($_SESSION['cart']) && array_search($itemId, $_SESSION['cart']) === false) {
          $_SESSION['cart'][] = $itemId;
          $resData['cntItems'] = count($_SESSION['cart']);
          $resData['success'] = 1;
      } else {
          $resData['success'] = 0;
      }

      echo json_encode($resData);
  }
Помогите, пожалуйста, разобраться для начала с тем, почему не подключаются скрипты: jquery-3.5.1.min.js и main.js?
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
Так тебе ясно пишет, что не может подключить JS скрипты. jQuery в их числе.
Надо "найти" скрипты: открой ссылки в отдельной вкладке (они будут также 404) и "попутешествуй" по URL.

Если стоит слеш в начале src="/ , то это означает, что путь будет браться от самого начала адреса (после домена).
В твоём случае это после test, то есть скорее всего браузер думает что файл лежит /мойшоплока/ввв
Не путать с ПАПКОЙ. Папка в таком виде получается компьютер/ОС/Панель/Домен/test/мойшоплока/мойшоплока/ввв (примерно).

Скажу по другому, переднbй слеш означает, что в какой бы директории ты не находился на сайте - он всегда будет считаться от корня.
То есть ты можешь зайти
мойсайт/каталог/
мойсайт/каталог/товар/ещё_что-то/
Слеш всегда будет говорить, что скрипты лежат
мойсайт/js/скрипт.js
Если слеш убрать, то браузер будет искать его
мойсайт/каталог/js/скрипт.js
мойсайт/каталог/товар/ещё_что-то/js/скрипт.js

В общем если ты не понял что я пишу, то читай про абсолютные и относительные пути.
А тебе можно попробовать просто убрать начальные слеш.

Что касается второй ошибки, то тут уже PHP явно ругается
1598030531711.png

Не может найти $item['id'] чтобы вставить
 
  • Like
Реакции: Pavl

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Так тебе ясно пишет, что не может подключить JS скрипты. jQuery в их числе.
Надо "найти" скрипты: открой ссылки в отдельной вкладке (они будут также 404) и "попутешествуй" по URL.

Если стоит слеш в начале src="/ , то это означает, что путь будет браться от самого начала адреса (после домена).
В твоём случае это после test, то есть скорее всего браузер думает что файл лежит /мойшоплока/ввв
Не путать с ПАПКОЙ. Папка в таком виде получается компьютер/ОС/Панель/Домен/test/мойшоплока/мойшоплока/ввв (примерно).

Скажу по другому, переднbй слеш означает, что в какой бы директории ты не находился на сайте - он всегда будет считаться от корня.
То есть ты можешь зайти
мойсайт/каталог/
мойсайт/каталог/товар/ещё_что-то/
Слеш всегда будет говорить, что скрипты лежат
мойсайт/js/скрипт.js
Если слеш убрать, то браузер будет искать его
мойсайт/каталог/js/скрипт.js
мойсайт/каталог/товар/ещё_что-то/js/скрипт.js

В общем если ты не понял что я пишу, то читай про абсолютные и относительные пути.
А тебе можно попробовать просто убрать начальные слеш.

Что касается второй ошибки, то тут уже PHP явно ругается
Посмотреть вложение 3224
Не может найти $item['id'] чтобы вставить
Спасибо, буду искать ошибку. Только, до сегодняшнего дня я думал, что, компилятор обязательно покажет, что не может найти определённый файл, если его нет. Получается, что это не факт, как, например, в данном случае?
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
Какой компилятор?
 

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Немного видоизменил код. В том числе изменил пути к скриптам:
HTML:
<script src="www/js/jquery-3.5.1.min.js" type="text/javascript"></script>
   <script src="www/js/main.js" type="text/javascript"></script>
В консоли на вкладках Console, Network теперь, когда находишься на главной странице вот, что:



Пути к скриптам (Console).JPG
Пути к скриптам (Network).JPG


C одной стороны в консоли видны ошибки. Но, на вкладке Network напротив скриптов установился статус - 200, ранее был - 404. Значит ли это, что скрипты нашлись и можно искать следующую ошибку?
Кстати, ошибка Uncaught SyntaxError: Unexpected token '<' мигрирует от одного файла к другому. Если ранее в Notice были предупреждения, что не может найти $item['id'] , то теперь этого нет, но есть другое - если нажать на ссылку query-3.5.1.min.js или main.js в консоли, то в обоих случаях, чем-то не нравится строка <!DOCTYPE html>.
Скрипты переход по ссылкам(Console).JPG
 

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
IDE такое не обязана видеть неправильные пути в HTML Тем более когда ты не понимаешь разницу между абсолютными и относительными путями.

Что касается <!DOCTYPE html>, то могу предположить, что проблема в том, что ты ты используешь DOCTYPE для html5,а потом HTML тег из старых версий.
Если навести на кресик курсор, то он напишет конкретно что за ошибка.

Что касается < - ну тут всё логично, браузер ругается что JS код невалидный, потому что PHP выдал тебе ошибку. На скринах ты это не показал, плохо искал.
 
  • Like
Реакции: Pavl

Pavl

Active Member
Регистрация
28.09.2016
Сообщения
43
Кое-что, кое-где, изменил, пути поменял. На текущий момент в консоли нет ошибок за исключением одной, которая появляется на всех страницах браузера:

Ошибка в консоли..JPG


Главная проблема не решается. Когда нажимаю "Добавить в корзину", то во-первых, ссылка "Добавить в корзину" должна исчезнуть, во-вторых, напротив ссылки "В корзине" вместо слова "пусто" должна появляться цифра. Ни того, ни другого не происходит.
Нажимаю "Добавить в корзину", в консоли файрбага появляется:

При нажатии на Добавить в корзину..JPG

Вроде всё Ok, но на странице ничего не меняется.

Скрипт main.js сейчас выглядит так:

JavaScript:
/**
*  Функция добавления товара в корзину
*
*  @param integer itemId ID продукта
*  @return в случае успеха обновятся данные корзины на странице
*/
function addToCart(itemId) {
    console.log("js - addToCart()");
    $.ajax({
        type: 'POST',
        async: false,
        url: "cart/addtocart/" + itemId + '/',
        dataType: 'json',
        success: function (data) {
            if(data['success']){
                $('#cartCntItems').html(data['cntItems']);

                $('#addCart_'+ itemId).hide();
                $('#removeCart_'+ itemId).show();
            }
        }

    });
}
Файл leftcolumn.tpl:

HTML:
{* левый столбец *}

<div id="leftColumn">


    <div id="leftMenu">
        <div class="menuCaption">Меню:</div>
        {foreach $rsCategories as $item}
            <a href="/?controller=category&id={$item['id']}">{$item['name']}</a><br />
            {if isset($item['children'])}
                {foreach $item['children'] as $itemChild}
                    --<a href="?controller=category&id={$itemChild['id']}">{$itemChild['name']}</a><br />
                {/foreach}
            {/if}
        {/foreach}

    </div>

        <div class="menuCaption">Корзина</div>
        <a href="/cart/" title="Перейти в корзину">В корзине</a>
        <span id="cartCntItems">
            {if $cartCntItems > 0}{$cartCntItems}{else}пусто{/if}
        </span>
</div>
Файл header.tpl:

HTML:
<html>
<head>
    <title>{$pageTitle}</title>
    <link rel="stylesheet" href="{$TemplateWebPath}css/main.css" type="text/css"/>
    <script src="js/jquery-3.5.1.min.js" type="text/javascript"></script>
    <script src="js/main.js" type="text/javascript"></script>
</head>
<body>
<div id="header">
    <h1>my shop - интернет магазин</h1>
</div>


{include file='leftcolumn.tpl'}

<div id="centerColumn">
Файл product.tpl:

HTML:
{* страница продукта*}
    <h3>{$rsProduct['name']}</h3>
    <img width="575" src="../www/images/products/{$rsProduct['image']}">
    Стоимость: {$rsProduct['price']}

    <a id="addCart_{$rsProduct['id']}" onclick="addToCart({$rsProduct['id']}); return false;" href="#">Добавить в корзину</a>
    <p> Описание <br />{$rsProduct['description']}</p>
Файл ProductController.php:

HTML:
<?php

/**
* ProductController.php
*
* Контроллер страницы товара (/product/1)
*
*/

//подключаем модели
include_once '../models/ProductsModel.php';
include_once '../models/CategoriesModel.php';

/**
* Формирование страницы продукта
*
* @param object $smarty шаблонизатор
*/

function indexAction($smarty) {
    $itemId = isset($_GET['id']) ? $_GET['id'] : null;
    if($itemId == null) exit();

    //получить данные продукта
    $rsProduct = getProductById($itemId);

    //получить все категории
    $rsCategories = getAllMainCatsWithChildren();

    $smarty->assign('pageTitle', '');
    $smarty->assign('rsCategories', $rsCategories);
    $smarty->assign('rsProduct', $rsProduct);

    loadTemplate($smarty, 'header');
    loadTemplate($smarty, 'product');
    loadTemplate($smarty, 'footer');
}
Ошибок, кроме одной, сейчас нигде не выводится. Как теперь определить, почему не работает код, так как надо?

При помощи отладочной функции
PHP:
function d($value = null, $die = 1)
{
    echo 'Debug: <br /><pre>';
    print_r($value);
    echo '</pre>';

    if($die) die;
определил, что в файл ProductController.php приходит значение идентификатора выбранного продукта в переменную $itemId. Такая же переменная есть и в файле main.js, которая приходит в функцию addToCart(itemId) и хотелось бы определить, что приходит в эту функцию, но, как это сделать я не знаю (это же не php код и функция d() тут не работает). Также, хотелось бы определить, что приходит в строку:

HTML:
{if $cartCntItems > 0}{$cartCntItems}{else}пусто{/if}
в переменную $cartCntItems (и приходит ли, что-то?), но, как это сделать не знаю.
 
Последнее редактирование модератором:

miketomlin

Well-Known Member
Регистрация
12.11.2013
Сообщения
101
Тебе же написали, что async: false устарело, т.е. его использование «осужается» (запомни слово deprecated).

Адреса в ссылках – жесть. Приведи все к единообразному виду. И лучше использовать спец. ф-ции для формирования адресов в ссылках, а то так и будешь пропущенный слеш сутками искать.
 
  • Like
Реакции: Pavl

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
И лучше использовать спец. ф-ции для формирования адресов в ссылках
Не надо ему это. Ему надо освоить основу основ работы за компьютером (это даже не программирование): абсолютные и относительные ссылки. Потом уже пусть разбирается со специальными функциями (что за функции имеются ввиду? Константы __DIR__ и __FILE__?)
Ничего плохого нет в том, чтобы всегда подключать файлы через абсолютные адреса от корня сайта (ведущим слешем). Но он не понимает как это работает.

Тебе же написали, что async: false устарело, т.е. его использование «осужается» (запомни слово deprecated).
Пока ему рано на этот счёт заморачиваться. Это всего лишь предупреждение. Пусть с другим разберётся.
Вполне возможно, что эту ошибку вызывает скрипт самого магазина, а не его.

Что касается остальной его простыни, то я ничего не понял. Хорошо когда предоставляется много инфы, плохо когда она избыточна и не по делу. Я предполагаю, что ошибка до сих пор та же самая, про которую упоминалось в начале ветки

На скрине не видно в коком файле и на какой строке ошибка. Там и надо смотреть.
 

miketomlin

Well-Known Member
Регистрация
12.11.2013
Сообщения
101
что за функции имеются ввиду? Константы __DIR__ и __FILE__?
??? Какое отношение эти маг. константы имеют к адресам? Пусть хоть адреса для динамика спец. ф-цией строит, а не хардкодит. Конечно, после того, как разберется во всем этом балагане:
cart/addtocart/12/
/?controller=category&id={$item['id']}
?controller=category&id={$itemChild['id']}
/cart/
{$TemplateWebPath}css/main.css
js/main.js
../www/images/products/{$rsProduct['image']}

К подключению php-файлов, конечно, тоже есть вопросы.
 
  • Like
Реакции: Pavl

BaNru

Пацифизжу
Команда форума
Регистрация
13.11.2010
Сообщения
4 137
Это всё сложно будет для него.
В 99.9% случаев для подключения стат.файлов, вне шаблонов разумеется, это всё не надо.
 
Верх Низ