تخطي للذهاب إلى المحتوى
القائمة
لقد تم الإبلاغ عن هذا السؤال
1 الرد
1675 أدوات العرض

I am trying to add a JS validation check on a webform in a custom module but dont get it to work. Who can help me to point out the issue in the code below. The file is added as asset into the manifest file. It should check if the Bank account has a correct IBAN nr.


II get these error message:

The following modules are needed by other modules but have not been defined, they may not be present in the correct asset bundle:

  • web.public.widget

The following modules could not be loaded because they have unmet dependencies, this is a secondary error which is likely caused by one of the above problems:

  • @leden_extensie/js/iban_validation


here is the iban_validation.js script located under leden_extensie/src/js



/** @odoo-module **/

import publicWidget from 'web.public.widget';
import { loadJS } from '@web/core/assets';

async function loadIbanLib() {
    await loadJS('https://cdn.jsdelivr.net/npm/iban@0.0.10/iban.js');
    return window.IBAN;
}

publicWidget.registry.IBANValidation = publicWidget.Widget.extend({
    selector: '.container',
    start: function () {
        this._super.apply(this, arguments);
        document.addEventListener('DOMContentLoaded', this._onDomContentLoaded.bind(this));
    },
    _onDomContentLoaded: async function () {
        console.log('DOMContentLoaded event fired');
        try {
            const IBAN = await loadIbanLib();
            console.log('IBAN library loaded:', IBAN);

            const bankrekeningInput = document.getElementById('bankrekening');
            if (bankrekeningInput) {
                bankrekeningInput.addEventListener('blur', () => this._validateAndFormatIBAN(IBAN));
                console.log('Event listener added to bankrekening input');
            } else {
                console.log('bankrekening input not found');
            }
        } catch (error) {
            console.error('Error loading IBAN library:', error);
        }
    },
    _validateAndFormatIBAN: function (IBAN) {
        const bankrekeningInput = document.getElementById('bankrekening');
        const bankrekening = bankrekeningInput.value.trim();
        console.log('Validating IBAN:', bankrekening);

        if (IBAN.isValid(bankrekening)) {
            bankrekeningInput.value = IBAN.printFormat(bankrekening, ' ');
            bankrekeningInput.setCustomValidity('');
            console.log('Valid IBAN:', bankrekeningInput.value);
        } else {
            bankrekeningInput.setCustomValidity('Invalid Bankrekening');
            bankrekeningInput.reportValidity();
            console.log('Invalid IBAN');
        }
    }
});



الصورة الرمزية
إهمال
أفضل إجابة

Hi,

Import the dependencies properly:

import PublicWidget from "@web/legacy/js/public/public_widget";


Hope it helps

الصورة الرمزية
إهمال
المنشورات ذات الصلة الردود أدوات العرض النشاط
0
نوفمبر 24
1281
2
يناير 25
1154
0
نوفمبر 24
1411
2
يوليو 24
2966
1
مايو 25
1752