[Kollo]

Nie cierpię tego #javascript jak większości polityków, no mam taki błachy problem a już zgłupiałem.
Prawidłowo powinno pokazywać tabelę szycie na wymiar po wybraniu atrybutu "szycie na wymiar" (id 153) - oraz go chować jak ktoś wybierze inny atrybut. Kod odpowiedzialny za to:

document.addEventListener('DOMContentLoaded', (event) => {
    const inputs = document.querySelectorAll('input[type="radio"]');
    inputs.forEach(input => {
        input.addEventListener('change', function() {
            const buttondesc = document.querySelector('.buttondesc');

            if(this.value == '153') {
                buttondesc.style.display = 'block';
            } else {
                buttondesc.style.display = 'none';
            }
        });
    });
});

Na moim sklepie Link Godzina 21:55 a mi wychodzi, że to problem raczej samej #prestashop
która dubluje kod odpowiedzialny za wyświetlanie "szycie na wymiar" . #webdev

Może błąd jest mega prosty a ja go nie widzę? Dla odważnego co pomoże mogę postawić jutro obiad przez pyszne pl do 120zł

[lobo]

@Kollo: Z tego co widzę to po kliknięciu jednego z rozmiarów to renderujesz nowe przyciski z rozmiarami i nie dodajesz do nich eventów na change (to są nowe elementy)

[lobo]

@Kollo: Musiałbyś napisać kod podpięty do change wrappera który się nie przerendorywuje po zmianie i w nim rozpoznawać jaka wartość jest

[Kollo]

@lobo: Czyli kod js do poprawy?

[lobo]

@Kollo: Tak, jak renderujesz nowe inputy to one zwyczajnie już nie mają tego eventa. Poszukaj hasła event delegation co można zrobić aby operować z takimi elementami. Kodu ci nie napiszę w tym momencie bo ledwo w klawisze trafiam :)

[Kollo]

Musiałbyś napisać kod podpięty do change wrappera który się nie przerendorywuje po zmianie i w nim rozpoznawać jaka wartość jest

@lobo: To już chyba za duże progi jak na moje nogi, ale spróbuję.

[lobo]

@Kollo: to jest bardzo proste tylko musisz sobie zlokalizować który wrapper się nie renderuje na nowo na changu, hasło event delegation.

[lobo]

document.getElementById('add-to-cart-or-refresh').addEventListener('change', function(e) {console.log(e)})

@Kollo: masz fragment do czego podpiąć zobacz co masz w e.target

[Kollo]

@lobo: Dodałem, widzę change na value, no noob jestem z js....

[KONONOWlCZ]

@Kollo: jaka to prestashop? w 17 i nowszych są emitery które można odpalić po zmianie na stronie produktu. Taką zmianą jest zmiana atrybutu. Skrypt odpala event i do niego możesz se wrzucić ponowne odpalenie swojego kodu js

updatedProduct
On the product page, selecting a new combination will reload the DOM via ajax calls. After the update, this event is fired.

if (typeof prestashop !== 'undefined') {
prestashop.on(
'updatedProduct',
function (event) {

[KONONOWlCZ]

@Kollo:
Masz gotowca

if (typeof prestashop !== 'undefined') {
prestashop.on(
'updatedProduct',
function (event) {
const inputs = document.querySelectorAll('input[type="radio"]');
    inputs.forEach(input => {
        input.addEventListener('change', function() {
            if(this.value == '153') {
                $('.buttondesc').show();
            } else {
                $('.buttondesc').hide();
            }
        });
    });
}
);
}

[KONONOWlCZ]

@Kollo: Pamiętaj, że oprócz wklejenia tego co zaproponowałem musisz jeszcze odpalić tę funcję on DOMContentLoaded albo jquery ready

np.

function refreshGuzikow() {
const inputs = document.querySelectorAll('input[type="radio"]');
    inputs.forEach(input => {
        input.addEventListener('change', function() {
            if(this.value == '153') {
                $('.buttondesc').show();
            } else {
                $('.buttondesc').hide();
            }
        });
    });
}

if (typeof prestashop !== 'undefined') {
   prestashop.on('updatedProduct', function (event) {
        refreshGuzikow();
   });
}

$(document).ready(function(){
  refreshGuzikow();
});

[Kollo]

@KONONOWlCZ: Działa! Dzięki Ci wielkie, nie wpadłbym na to. Oczywiście słowo się rzekło, napisz na priv co mogę i na jaki adres zamówić z pyszne pl lub przelew paypal puszczę za Twoją pomoc.

[KONONOWlCZ]

@Kollo: daj spokój :) Jestem na diecie :P jak możesz to wpłać gdzieś kilkanaście/dziesiąt zł na jakąś fundację onkologiczną albo jakąś od zwierząt i elo - będziemy kwita ;)

[Kollo]

@KONONOWlCZ: Wpłaciłem na siepomaga.pl link
Dzięki.

[Kollo]

@KONONOWlCZ: Jeszcze jedna rzecz nie daje mi spokoju, jak wejdę na kategorię np kurtki i kliknę w "szycie na miarę" pod zdjęciem danej kurtki to otwiera się dana podstrona produktu, ale bez pól do wypełnienia. Muszę przeklikać w np. XL i wrócić na szycie na wymiar. refresh działą tylko na przełdowanie, ale nie na otwarcie strony?

[KONONOWlCZ]

bo tam jest eventListener change, czyli sprawdza wartość wybranego atrybutu tylko po zmianie atrybutu
trzeba by bylo jeszcze dopisać coś co sprawdzi stan bez zmiany właśnie dla takiej sytuacji że sie po prostu wchodzi na stronę.

zmien funkcję refreshGuzikow() na

function refreshGuzikow() {
    const inputs = document.querySelectorAll('input[type="radio"]');
    inputs.forEach(input=>{

     $('.product-variants input[type="radio"]:checked').each(function(){
         if ($(this).val() == '153') {
          $('.buttondesc').show();
         }
     });

        input.addEventListener('change', function() {
            if (this.value == '153') {
                $('.buttondesc').show()
            } else {
                $('.buttondesc').hide()
            }