Скрыть/Отобразить HTML блок состоящих из tv в зависимости от выбора в модальном окне через pdoResources

Добрый день, помогите вывести в модальном окне tv для каждой новости. Так правильно отображается только для первой новости.

pdoResources
[[pdoResources?
    &parents=`7`
    &depth=`0`
    &tpl=`eonegame_tpl`
    &sortby=`menuindex`
    &sortdir=`ASC`
    &includeTVs=`img,buy,currence,price,services,txt,ptxt,1mtxt,1ctxt,2mtxt,2ctxt,3mtxt,3ctxt]]


В eonegame_tpl соответственно сама форма новости, их например 3 выводится, в каждой открывается модально окно где при выборе подписки выводится его цена.

Script:
let select = document.getElementById('select');
let block = document.querySelectorAll('.block');
let lastIndex = 0; // После каждой смены опции, сохраняем сюда индекс предыдущего блока

select.addEventListener('change', function() {
  block[lastIndex].style.display = "none"; 
  // Чтобы сразу делать именно его невидимым при следующей смене 

  let index = select.selectedIndex; // Определить индекс выбранной опции
  block[index].style.display = "block"; // Показать блок с соответствующим индексом

  lastIndex = index; // Обновить сохраненный индекс.
});


Html в модальном окне:
 
<div class="form-group">
  <select id="select">
    <option> [[+tv.podtxt:default=`Выбрать подписку`]]</option>
    <option>[[+tv.1mtxt]]</option>
    <option>[[+tv.2mtxt]]</option>
    <option>[[+tv.3mtxt]]</option>
  </select>
</div>
<div class="block" style="visibility: hidden;"></div>
<div class="block">  <h3>[[+tv.1mtxt]] <p>[[+tv.1ctxt]]</p></h3></div>
<div class="block">  <h3>[[+tv.2mtxt]] <p>[[+tv.2ctxt]]</p></h3></div>
<div class="block">  <h3>[[+tv.3mtxt]] <p>[[+tv.3ctxt]]</p></h3></div>

Работает всё правильно только для первой новости, остальные выводят пустоту.
Гарник
Гарник
16 апреля 2023, 23:24
modx.pro
701
0

Комментарии: 5

Артур Шевченко
Артур Шевченко
17 апреля 2023, 14:49
0
Модальное окно одно на 3 формы?
    Гарник
    Гарник
    17 апреля 2023, 20:21
    0
    У каждой формы своё окно, вставил его в pdoResources
    Vladimir
    Vladimir
    17 апреля 2023, 19:25
    0
    Покажите подробней вашу страницу, затем покажите как она выглядит, покажите как выглядит, в идеале дать ссылку, так как по идеи ваш код рабочий. А вообще лучше сделать вам было так: сделать 1 модальное окно, и потом после выбора пользователем просто брать textContent выбранной цены, и затем эту цену ставить в ваш блок где нужно, и это избавит вас от мусора, и геморроя. Не нужно ничего будет скрывать и раскрывать.
    Без полной картины вам тут не помочь, так как ошибка может возникнуть в другом месте в идеале дать ссылку на страницу где у вас проблема.

    let productSusbscriptions = document.getElementById('select');
let productSubscriptionModalWindow = document.querySelector('.subscription-window');
let productSubscriptionPrice = document.querySelector('.product-price', productSubscriptionModalWindow);

productSusbscriptions.addEventListener('change', function() {

    productSubscriptionPrice.textContent = productSusbscriptions.value;
    productSubscriptionModalWindow.style.display = "block";

});
    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
    5