I want to default time to 9:00 AM when user selects date first time. Still He is allowed to change the time. I am using below tag for DateTime input field:

<ui:inputDateTime aura:id="startDate" value="{!v.startDate}" label="Approved Event Start Date" class="form-control" displayDatePicker="true" required="true"/>

Default Time value:

  • While not a great solution, you can perhaps use the code here for the ui:inputDateTime: lightningdesignsystem.com/components/datetime-picker which splits apart everything, this way you can set the default of each component seperately – Aequitas Jan 22 '18 at 6:09
  • If you don't specify a perfectly valid ISO 8601 Date/Time, you get undefined behavior. You can specify a date without a time, but not a time without a date. You might want to see if you can report this as a bug. – sfdcfox Jan 22 '18 at 6:11
  • @sfdcfox I have tried to set only Time It doesn't work. So I am trying to use change event attribute on the Input tag => change="{!c.setApprovalStartTime}" But I am not able to restrict it to run only once. It would be great if you could help me here. Thanks. – RKM Jan 22 '18 at 6:14
  • @Rohit Change handlers run on every change, yes. You'd have to make your own custom input if you want behavior at this level of detail. – sfdcfox Jan 22 '18 at 6:19
  • @sfdcfox I figured it out with below approach. – RKM Jan 25 '18 at 7:33

I opted the below approach. Create ui:inputDateTime with Change Event see below:

<aura:attribute name="startDate" type="DateTime" />
<ui:inputDateTime aura:id="startDate" value="{!v.startDate}" label="Start Date" class="form-control" displayDatePicker="true" change="{!c.setStartTime}" required="true"/>

Create below Java Script code and store it in Static Resource..

var utilityMethods = {

function setStartTime(){
    myUtil.setStartTime = function(){};
    return 'Affirmative';
w.myUtil = utilityMethods;  })(window);

Now use above static Resource in your Lightning Component and inside your controller.JS create below function:

setStartTime: function(component, event, helper){

    var startdateValue = new Date(component.get("v.startDate"));
    var responseFromStaticResource = myUtil.setTimeSS();
        alert('It will run only once as Required');
        component.set("v.startDate", startdateValue.toISOString());


You are done! It works perfect. Select the date at the first time the Time value will be set to 9:00 AM

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.