Our state of the art Gantt chart


Post by pshdevs »

I created a es translation file (since you don't have one), and I can't get to translate the percentage column errors (see images). I might be missing some keys on the locale.es. Do you know which ones?
translate1.png
translate1.png (23.22 KiB) Viewed 1337 times
translate2.png
translate2.png (18.16 KiB) Viewed 1337 times
translate3.png
translate3.png (21.59 KiB) Viewed 1337 times

Post by pmiklashevich »

Hello!

Thanks for the report! Looks like a bug. We use validationMessage which is a native read-only property contained a localized error message which depends on the browser locale. Ticket here:
https://github.com/bryntum/support/issues/729

Basically, here is an example (draft) of how this could be overcome, until the bug is fixed:
you can override Field getErrors public function, and localize the state extracted from ValidityState object.
import ObjectHelper from '../../lib/Core/helper/ObjectHelper.js';
import Override from '../../lib/Core/mixin/Override.js';
import Field from '../../lib/Core/widget/Field.js';

class FieldOverride {
    static get target() {
        return {
            class : Field
        };
    }

    getErrors() {
        const me = this;

        if (!me.isValid) {
            const
                validity  = me.input.validity,
                // See possible state names: https://developer.mozilla.org/en-US/docs/Web/API/ValidityState
                stateName = ObjectHelper.allKeys(validity).find(key => key !== 'valid' && key !== 'customError' && validity[key]);

            let errors;

            if (me.errors) {
                errors = ObjectHelper.getTruthyValues(me.errors);
            }
            // If custom error message was set using https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity
            else if (validity.customError) {
                errors = [me.input.validationMessage];
            }
            // If invalid state found, translate it
            else if (stateName) {
                errors = [me.L(stateName)];
            }
            // If built-in state is 'valid' but me.isValid is false, show our invalid message
            else {
                errors = [me.L('invalidValue')];
            }

            if (errors && errors.length) {
                return errors;
            }
        }
    }
}

Override.apply(FieldOverride);
Then need to specify translation for statuses per locale, like this:
    Field : {
        // native input ValidityState statuses
        badInput        : 'badInput',
        patternMismatch : 'patternMismatch',
        rangeOverflow   : 'rangeOverflow',
        rangeUnderflow  : 'rangeUnderflow',
        stepMismatch    : 'stepMismatch',
        tooLong         : 'tooLong',
        tooShort        : 'tooShort',
        typeMismatch    : 'typeMismatch',
        valueMissing    : 'valueMissing',
Best regards,
Pavel

Pavlo Miklashevych
Sr. Frontend Developer


Post Reply