const tabs_lists = document.querySelectorAll('.nav-tabs[role="tablist"]');
let tabs = [];

tabs_lists.forEach((tabs_list) => {
    tabs = [...tabs, ...tabs_list.querySelectorAll('[role="tab"]')];
})

tabs.forEach((tab) => {
    tab.addEventListener('hide.bs.tab', event => {
        const id_content_hide = event.target.getAttribute('data-bs-target');
        const id_content_show = event.relatedTarget.getAttribute('data-bs-target');

        console.log('==== Hide ====');
        const content_hide = document.querySelector(id_content_hide);
        content_hide.querySelectorAll('input, textarea, button').forEach((el) => {
            console.log(el);
            el.disabled = true;
        });

        console.log('==== Show ====');
        const content_show = document.querySelector(id_content_show);
        content_show.querySelectorAll('input, textarea, button').forEach((el) => {
            console.log(el);
            el.disabled = false;
        });
    });

    if (!tab.getAttribute('aria-selected')) {
        const id_content_hide = tab.getAttribute('data-bs-target')
        const content_hide = document.querySelector(`#${id_content_hide}`);
        content_hide.querySelectorAll('input, textarea, button').forEach((el) => {
            el.disabled = true;
        });
    }
})