Не отображается html код после события js

Question

При нажатии на input type="radio", js должен был показать скрытый код. Код js писал чат gpt, потому что я без понятия как самому писать на js(( Я много раз пробовал через gpt выдавить правильный код, но он только выдал тот, чтобы показывались input text, а те что input select не выводится. Вот код и картинка того, как выглядит страничка при нажатии на радио.

{% load filters %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<h4>Парсинг сайтов</h4>
<form action="/parsing" method="POST">
    <input type="hidden" name="email" data-form-email="true"
           value="M+RQtseefxtmf16fhRUESPKJldQjlL6d2POqbfZVyYPg7LjyR2HSMMIPJ99qx3wrPCDvvLpA2qX2oefKowouPJfKSYsUXjrf4V6lHR3ujv4dg89rgINXL+UYemJZnPr5.j2E4egrA2q6u7WNuN3vdpeFg6lcO/viIkuomvqCCJOIa3I2M8lAnffN/ozrwaOdVsfxYMa8wj0EM7InYSbkendv25m6r2IkSkqVd0yBofn1+0RUsQXTWqgkJdRYbANHC">

    <div>
        <textarea name="sites" placeholder="Вставьте сайты через пробел" required="required"></textarea>
    </div>
    <div>
        <textarea name="product" placeholder="Перечислите товары через восклицательный знак !"></textarea>
    </div>
    <div>
        <div>
            <h4>Тип товара</h4>
        </div>
        {% for k, v in rows.items %}
  <div>
    <input type="radio" name="check_type_prod" value="{{ k }}" id="radiooo_{{ forloop.counter0 }}">
    <label for="radiooo_{{ forloop.counter0 }}">{{ k }}</label>
  </div>
  <div style="display: none;" id="none_dude_{{ forloop.counter0 }}">
    {% for el in v %}
      {% if el|get_type == 'str' %}
        <label for="radiooo_{{ forloop.parentloop.counter }}">{{ el }}</label>
        <input type="text" name="{{ el }}" id="{{ el }}"><br>
      {% elif el is dict %}
        {% for q, f in el.items %}
          <label for="radiooo_{{ forloop.parentloop.parentloop.counter }}">{{ q }}</label>
          <select name="{{ q }}" id="select_{{ q }}">
            <option value="True{{ q }}">True</option>
            <option value="False{{ q }}">False</option>
          </select><br>
        {% endfor %}
      {% endif %}
    {% endfor %}
  </div>
{% endfor %}



    </div>

    <div class="col">
        <button type="submit">Найти и скачать</button>
    </div>
</form>

<script>
document.addEventListener("DOMContentLoaded", function() {
  var checkboxes = document.querySelectorAll("[name='check_type_prod']");
  var inputContainers = document.querySelectorAll("[id^='none_dude_']");

  checkboxes.forEach(function(checkbox, index) {
    checkbox.addEventListener("change", function() {
      var inputContainer = document.getElementById("none_dude_" + index);

      if (this.checked) {
        inputContainer.style.display = "block";
      } else {
        inputContainer.style.display = "none";
      }
    });
  });
});

</script>

</body>
</html>

Так же вот словарь который в питоне отправляется на страницу с django/jinja:

d = {
        'all': ['компания', 'производитель', 'цвет', 'материал', 'максимальная потребляемая мощность', 'напряжение питания', 'вес', 'цена', 'класс энергопотребления'],
        'печь / духовка': ['объем печи', 'максимальная температура'],
        'холодильник': ['объем', 'минимальная температура', 'уровень шума', 'хладагент', ],
        'посудомойка': ['объем', 'минимальная температура', 'материал', 'тип сушки', 'максимальная температура', 'потребление воды', 'потребление энергии'],
        'апараты для напитков': ['объем', 'тип нагревательного элемента', 'максимальная температура',
                                 {'поддержание температуры': 'bool'}, ],
        'гриль': ['минимальная температура', 'максимальная температура', {'поддержание температуры': 'bool'}, 'рабочая поверхность', ],
        'тостер': ['максимальная температура', 'количество отделений', 'количество тостов',
                   {'автоотключение': 'bool'}, {'трафарет': 'bool'}],
        'фритюр': ['минимальная температура', 'максимальная температура', 'объем', {'автослив масла': 'bool'}],
        'мультиварка': ['максимальная температура', 'минимальная температура', 'объем', {'поддержание температуры': 'bool'}],
        'кухонные весы/ весы': ['лимит веса', 'точность взвешивания', 'тип батареи', ],
        'стиралка': ['объем', 'максимальынй вес', 'минимальная температура', 'максимальная температура', 'уровень шума', 'потребление воды', 'скорость вращения барабана'],
        'сушилка': ['объем', 'максимальынй вес', 'уровень шума', ],
        'утюг': ['максимальная температура', 'минимальная температура', ],
        'пылесос': ['тип уборки', 'уровень шума', {'регулятор мощности': 'bool'}],
        'робот пылесос': ['тип уборки', 'уровень шума', 'тип сенсоров', 'время работы', 'время зарядки'],
        'водонагреватель/ бойлер': ['минимальная температура', 'максимальная температура', 'объем', 'способ крепления', 'расход топлива'],
        'кондиционер': ['мощность охлаждения', 'мощность обогрева', 'отапливаемая территория', 'хладагент', ],
        'вентилятор': ['способ крепления', {'регулятор мощности': 'bool'}, {'регулировка термостата': 'bool'}, 'рабочая территория'],
        'обогреватель': ['способ крепления', 'топливо', 'расход топлива', {'регулятор мощности': 'bool'}, {'регулировка термостата': 'bool'}, 'отапливаемая территория', ],
        'швейная машинка': ['тип челнока', {'регулировка скорости шитья': 'bool'}, {'двойная игла': 'bool'}, ],
        'уход за волосами': [{'защита от перегрева': 'bool'}, 'насадки', 'максимальная температура'],
        'электро-бритва': ['насадки', {'cамозатачивающиеся ножи': 'bool'}, 'материал лезвий', 'время зарядки'],
        'фотоаппараты и их комплектация': ['общее число мегапикселей матрицы', 'число эффективных мегапикселей', 'тип матрицы', 'максимальное разрешение', 'количество объективов',
                                           {'поддержка 4К': 'bool'}, {'поддержка full hd': 'bool'}, ],
        'микроволновка': ['объем', 'рабочая поверхность'],
        'освещение': ['цокль', 'цвет света', 'срок службы', 'колличество источников света', 'максимальная освещаемая территория', ],
        'розетка/ переключатель': ['внутренние габариты', 'колличество кнопок', ],
        'принтеры/ сканеры': ['скорость печати', 'технология подключения', {'двусторонняя печать': 'bool'}, 'поддерживаемые форматы бумаг',
                              {'цветная печать': 'bool'}, ],
        'настольные игры': ['издательский дом', 'кол-во игроков', 'время игры', 'ограничения по возрасту', 'жанр', 'язык игры', ], # допавить поиск этого в тексе
        'детские игрушки': ['материал на ощупь (твердая, плюшевая, мягкая, резиновая)', 'вес', 'цвет'], # допавить поиск этого в тексе
        'провода': ['проводник', 'изоляция', 'электрическое сопротивление', 'рабочее напряжение'],
        'роутер/ маршрутизатор': ['стандарт wifi', 'максимальная скорость', 'диапазон частот'] # допавить поиск этого в тексе

    }

БЛОГ НА HUSL

Не отображается html код после события js

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