Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.09.2023, 16:03
Интересующийся
Отправить личное сообщение для Вадим2019 Посмотреть профиль Найти все сообщения от Вадим2019
 
Регистрация: 26.09.2023
Сообщений: 11

Вывод результата функции в div
Добрый день!
Имею вот такой код

<script>
function callbackFunction(data) {
  const paramsContainer = document.querySelector('.map__params');
 
  paramsContainer.innerHTML = '';
 
  for (const key in data) {
    const param = document.createElement('div');
    const paramValue = document.createElement('span');
 
    param.className = 'map__params-item';
    param.textContent = `${key}: `;
 
    paramValue.textContent = typeof data[key] === 'object' ? JSON.stringify(data[key]) : data[key];
 
    param.appendChild(paramValue);
    paramsContainer.appendChild(param);
 
  }
 
}
  document.getElementById('paramValue').innerHTML = data[indexTo];
</script>
 
<div id="param"><span id="paramValue"></span></div>


Код должен выдавать ответ в следующем виде

Код:
{
  "addressTo": "ул Советская",
  "areaTo": null,
  "boxSize": "m",
  "cashOfDelivery": 26400,
  "cityTo": "г Ростов-на-Дону",
  "deliveryDescription": {
    "description": "от 1 до 2 дней + обработка заказа 10 часов",
    "values": {
      "deliveryMax": 2,
      "deliveryMin": 1,
      "extraTimeInHours": 10
    }
  },
  "indexTo": "344019",
  "mailType": "POSTAL_PARCEL",
  "pvzType": "russian_post",
  "id": 44342,
  "regionTo": "обл Ростовская",
  "sumoc": "150000",
  "weight": "1000"
}
При помощи document.getElementById('paramValue').innerHTML = data[indexTo]; пытаюсь вывести значение indexTo в div/span.

Но ничего не выводится, подскажите как решить задачу?
Ответить с цитированием
  #2 (permalink)  
Старый 26.09.2023, 16:27
Аватар для Cuntmann
Аспирант
Отправить личное сообщение для Cuntmann Посмотреть профиль Найти все сообщения от Cuntmann
 
Регистрация: 26.01.2014
Сообщений: 78

Попробуйте расположить ваш скрипт ниже дива по коду
Ответить с цитированием
  #3 (permalink)  
Старый 26.09.2023, 16:27
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,742

А где элемент с классом map__params?
И что такое indexTo?
Где вызов функции callbackFunction?
Что такое data в
document.getElementById('paramValue').innerHTML = data[indexTo];

Вы в консоль то заглядываете? Просто что бы посмотреть ошибки.

Последний раз редактировалось voraa, 26.09.2023 в 16:30.
Ответить с цитированием
  #4 (permalink)  
Старый 26.09.2023, 16:35
Интересующийся
Отправить личное сообщение для Вадим2019 Посмотреть профиль Найти все сообщения от Вадим2019
 
Регистрация: 26.09.2023
Сообщений: 11

Сообщение от Cuntmann Посмотреть сообщение
Попробуйте расположить ваш скрипт ниже дива по коду
Это не помогает..
Ответить с цитированием
  #5 (permalink)  
Старый 26.09.2023, 16:37
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,742

И кстати
typeof null === 'object'
Ответить с цитированием
  #6 (permalink)  
Старый 26.09.2023, 16:40
Интересующийся
Отправить личное сообщение для Вадим2019 Посмотреть профиль Найти все сообщения от Вадим2019
 
Регистрация: 26.09.2023
Сообщений: 11

Сообщение от voraa Посмотреть сообщение
А где элемент с классом map__params?
И что такое indexTo?
Где вызов функции callbackFunction?
Что такое data в
document.getElementById('paramValue').innerHTML = data[indexTo];

Вы в консоль то заглядываете? Просто что бы посмотреть ошибки.
Вызов функции:
Код:
<div id="forpvzrp" style="display: none;">
<div id="ecom-widget" style="height: 500px;">
<script src="https://widget.pochta.ru/map/widget/widget.js" type="text/javascript"></script><script type="text/javascript">// <![CDATA[
    ecomStartWidget({
      id: 0000,
     callbackFunction: callbackFunction,
      containerId: 'ecom-widget'
    });
// ]]></script></div>

indexTo - это значение индекса из ответа.

Консоль ругается на Uncaught ReferenceError: data is not defined в строке document.getElementById('paramValue').innerHTML = data.indexTo;

Также ругается на
Cannot set properties of null (setting 'innerHTML') at Object.callbackFunction в строке paramsContainer.innerHTML = '';
Ответить с цитированием
  #7 (permalink)  
Старый 26.09.2023, 16:46
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,742

Сообщение от Вадим2019
indexTo - это значение индекса из ответа.

Консоль ругается на Uncaught ReferenceError: data is not defined в строке document.getElementById('paramValue').innerHTML = data.indexTo;

Также ругается на
Cannot set properties of null (setting 'innerHTML') at Object.callbackFunction в строке paramsContainer.innerHTML = '';
Ну так indexTo должно быть где то описано и ему должно быть присвоено какое то значение. Где этот индекс считается?
data у вас определена как параметр функции. А вне функции никакой data нет.

const paramsContainer = document.querySelector('.map__params');
Если нет элемента с классом map__params, то paramsContainer будет null.

ЗЫ Так data.indexTo или data[indexTo] ?

Последний раз редактировалось voraa, 26.09.2023 в 16:48.
Ответить с цитированием
  #8 (permalink)  
Старый 26.09.2023, 16:51
Интересующийся
Отправить личное сообщение для Вадим2019 Посмотреть профиль Найти все сообщения от Вадим2019
 
Регистрация: 26.09.2023
Сообщений: 11

в первом сообщении написал:
функция должна возвращать вот такой ответ, indexTo в нем
{
  "addressTo": "ул Советская",
  "areaTo": null,
  "boxSize": "m",
  "cashOfDelivery": 26400,
  "cityTo": "г Ростов-на-Дону",
  "deliveryDescription": {
    "description": "от 1 до 2 дней + обработка заказа 10 часов",
    "values": {
      "deliveryMax": 2,
      "deliveryMin": 1,
      "extraTimeInHours": 10
    }
  },
  "indexTo": "344019",
  "mailType": "POSTAL_PARCEL",
  "pvzType": "russian_post",
  "id": 44342,
  "regionTo": "обл Ростовская",
  "sumoc": "150000",
  "weight": "1000"
}


В самом скрипте ошибки точно не должно быть, так как это готовое решение с сайта почты россии, я же пытаюсь вывести из ответа этой функции значение в поле div.

Все что я самостоятельно подписал в скрипте это:
document.getElementById('paramValue').innerHTML = data[indexTo];
Ответить с цитированием
  #9 (permalink)  
Старый 26.09.2023, 16:54
Интересующийся
Отправить личное сообщение для Вадим2019 Посмотреть профиль Найти все сообщения от Вадим2019
 
Регистрация: 26.09.2023
Сообщений: 11

Виджет установленный на сайте должен передавать в эту callback функцию ответ, который я прикрепил выше.. А я из этого ответа должен как то взять значения... Сам виджет работает, пункт выдачи выбирается.. Ошибок нет..
Ответить с цитированием
  #10 (permalink)  
Старый 26.09.2023, 16:57
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,742

Сообщение от Вадим2019
Все что я самостоятельно подписал в скрипте это:
document.getElementById('paramValue').innerHTML = data[indexTo];
Ну не пишут data[indexTo], если indexTo не переменная, а имя свойства!

Но все равно, если нет элемента с классом map__params, то paramsContainer будет null!

И data вне функции должна быть как то определена!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Вывод width и height у div при изменении его размера zhsv007 Events/DOM/Window 3 04.04.2022 17:22
Получение результата функции Artur_Hopf Общие вопросы Javascript 2 03.05.2018 16:06
Вывод из div в input value динамически? dwib Общие вопросы Javascript 1 29.10.2017 19:42
Вывод нескольких переменных с функции SnowyWolf Общие вопросы Javascript 10 23.04.2014 14:34
Вывод значений таймера в div Tylmaril (X)HTML/CSS 7 21.07.2013 16:47