Input fields broken design after clicking on other url then

Topic: Input fields broken design after clicking on other url then back in browser

agenda priority asked 2 years ago

Hey,

when i write something to the Basic example input field here - https://mdbootstrap.com/docs/standard/forms/input-fields/ and then in main manu click on some other page like Support or Services and then i click back button in my web browser i get corrupted layout/design on input field (see attached screenshot).

enter image description here

Add comment

agenda priority answered 2 years ago

0 0 Best answer

Thank you. Can you let us know when you will apply the fix in new update/release.

Add comment

Mateusz Lazaru staff answered 2 years ago

0 0 Best answer

It seems like DOMContentLoaded fires before inputs receive their values back in several browsers.

try to use this code as a workaround:

document.addEventListener('DOMContentLoaded', () => {
  setTimeout(() => {
    const inputs = document.querySelectorAll('input.form-control')
    inputs.forEach((input) => {
      if(input.value != '') {
        input.classList.add('active')
      }
    })
  }, 100);
})

Add comment

Kamila Pieńkowska staff answered 2 years ago