молния: введите Дата Проверка поля

Я пытаюсь использовать средство выбора стандартной даты, используя указанный ниже компонент, но, тем не менее, я хочу отображать настраиваемое сообщение об ошибке, когда введенная дата не находится в указанном минимальном и максимальном диапазоне. Но я не могу этого добиться, так как видел стандартное сообщение об ошибке. Я реализовал то же самое, обратившись к: https://developer.salesforce.com/docs/component-library/bundle/lightning:input/example, и по этой ссылке я вижу, что могут отображаться настраиваемые сообщения об ошибках. Но у меня ничего не работало, может ли кто-нибудь помочь. https://developer.salesforce.com/docs/component-library/bundle/lightning:input/documentation

<lightning:input aura:id="field
                     type="date" 
                     name="MyDatefield" 
                     label="MyDateField" 
                     value="2017-09-07" 
                     min="2017-09-05" 
                     messageWhenRangeUnderflow="Select correct date range1"
                     max="2017-09-22" 
                     messageWhenRangeOverflow="Select correct date range2"
                     onchange="{!c.checkValidity }"
</aura:component>

person user10490801    schedule 11.10.2018    source источник


Ответы (1)


Об этом спросили 1 месяц назад, но поделитесь ответом, если кто-нибудь еще столкнется с этим. Используйте методы Lightning setCustomValidity () и reportValidity ().

Составная часть:

    <aura:component >
    <lightning:input aura:id="field"
                     type="date" 
                     name="MyDatefield" 
                     label="MyDateField" 
                     value="2017-09-07" 
                     min="2017-09-05" 
                     max="2017-09-22" 
                     onblur ="{!c.checkValidity }"
             />
</aura:component>

Контроллер:

({
    checkValidity : function(component, event, helper) {
        var inputCmp = component.find("field");
        inputCmp.setCustomValidity(""); //reset error
        var value = inputCmp.get("v.value");
        console.log('value: '+value);
        var lowerRange =  new Date("2017/09/05"); 
        var higherRange =  new Date("2017/09/22"); 
        if(!inputCmp.checkValidity()){
            if(Date.parse(value)){
                if (Date.parse(value) < lowerRange) {
                    inputCmp.setCustomValidity("Select correct date range1");
                }else if (Date.parse(value) > higherRange){
                    inputCmp.setCustomValidity("Select correct date range2"); 
                }
            }else{
                inputCmp.setCustomValidity("Invalid value");
            }
        }
        inputCmp.reportValidity();
    }
})
person TheTimeKeeper    schedule 07.12.2018