Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Init / update fields

dagaey free asked 1 year ago


I have a form which has many fields and based upon certain logic sometimes shows fields, sometimes hides them and sometimes disables them.

I am currently using the following to initialize the fields:

document.querySelectorAll('.ed-text').forEach((txtf) => {
        new mdb.Input(txtf).init();
    });

    document.querySelectorAll('.ed-date').forEach((dtp) => {
        new mdb.Datepicker(dtp, {
          title: 'Datum auswählen',
          monthsFull: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli', 'August', 'September', 'Oktober', 'November', 'Dezember'],
          monthsShort: ['Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov','Dez'],
          weekdaysFull: ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'],
          weekdaysShort: ['Son', 'Mon', 'Die', 'Mit', 'Don', 'Fre', 'Sam'],
          weekdaysNarrow: ['S', 'M', 'D', 'M', 'D', 'F', 'S'],
          okBtnText: 'Ok',
          clearBtnText: 'Klar',
          cancelBtnText: 'Schließen',
        });
    });

    document.querySelectorAll('.ed-select').forEach((slct) => {
        new mdb.Select(slct);
    });

    document.querySelectorAll('.form-outline').forEach((formOutline) => {
        new mdb.Input(formOutline).init();
    });

The problem is that if I run the code again for a new logic, this causes errors as some fields are initialized again. Do I need to destroy existing inputs and if so how? Or is there a way to do "Init or update" for these types of fields (text,select, datepicker) ?


Kamila Pieńkowska staff answered 1 year ago


This depends on the input type. For select you need to dispose of it every time you change it and init again with new options.

For Timepicker you have the update method available. For form-outline also you can do:

document.querySelectorAll('.form-outline').forEach((formOutline) => {
        new mdb.Input(formOutline).update();
    });


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 6.2.0
  • Device: desktop
  • Browser: chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: No
Tags