You need to sign in to do that
Don't have an account?
Narendra Reddy Gopavaram
Lightning Component ui:inputdate value format and validation issue in desktop and mobile browser?
Hi All,
I am facing issue with ui:inputDate format and validation in desktop and mobile browser.
When selecting date from date picker it is working fine without any change action, but when entered date manually it is not validating.
For change action i have written below Cmpctrl.js
<label><b>Birthdate</b></label><br/>
<ui:inputDate aura:id="bdate" change="{!c.datehandler}" class="slds-input select-auto-width" value="{!v.con.Birthdate}" displayDatePicker="true"/>
datehandler : function(component, event, helper) {
var dob = new Date(component.find("bdate").get("v.value"));
console.log(dob);
var formattedDoB = dob.getMonth()+1+ '/' + dob.getDate() + '/' + dob.getFullYear();
console.log('formattedDoB'+formattedDoB)
component.set('v.con.Birthdate',formattedDoB);
},
With above ctrl.js when selecting date from datepicker or entering manually it display unknown value, see below image.
Please help me to resolve my issue. Advanced Thanks...
I am facing issue with ui:inputDate format and validation in desktop and mobile browser.
When selecting date from date picker it is working fine without any change action, but when entered date manually it is not validating.
For change action i have written below Cmpctrl.js
<label><b>Birthdate</b></label><br/>
<ui:inputDate aura:id="bdate" change="{!c.datehandler}" class="slds-input select-auto-width" value="{!v.con.Birthdate}" displayDatePicker="true"/>
datehandler : function(component, event, helper) {
var dob = new Date(component.find("bdate").get("v.value"));
console.log(dob);
var formattedDoB = dob.getMonth()+1+ '/' + dob.getDate() + '/' + dob.getFullYear();
console.log('formattedDoB'+formattedDoB)
component.set('v.con.Birthdate',formattedDoB);
},
With above ctrl.js when selecting date from datepicker or entering manually it display unknown value, see below image.
Please help me to resolve my issue. Advanced Thanks...
Can you check if v.cn.Birthdate is a valid attribute and it is case sensative? value="{!v.con.Birthdate}"
You may try add change that binding to a temporary attribute:
add line:
<aura:attribute name="Birthdate" type="Date"/>
Update line in html
<ui:inputDate aura:id="bdate" change="{!c.datehandler}" class="slds-input select-auto-width" value="{!v.Birthdate}"
and js file
component.set('v.Birthdate',formattedDoB);
This can confirm your change method is work.
It could be when you retrieve data in Apex, the Birthdate field is not in SOQL.