<aura:attribute name="dueDate" type="Date"/>
<aura:attribute name="dueDateString" type="String"/>
<aura:handler name="change" value="{!v.dueDate}" action="{!c.dueDateChanged}"/>

<ui:inputDate aura:id="dueDateField" format="MMM d, YYYY" displayDatePicker="true" value="{! v.dueDate }"/>

Controller

dueDateChanged: function(component) {
        var dueDate = component.get("v.dueDate");
        if (dueDate) {
            component.set("v.dueDateString", $A.localizationService.formatDate(dueDate) );
        } else {
            component.set("v.dueDateString", '');
        }
        console.log( 'dueDateString: ', component.get("v.dueDateString") );
    },

The first time when I set the date there is no issue but when I can change the date again, I run into the below issue:

Uncaught Action failed: ui:datePickerGrid$controller$dateCellSelected [dateCellCmp.updateCell is not a function]

  • 1
    Can you post your controller and/or helper code? – JRiffe Sep 25 '17 at 16:03
  • 2
    I dont get any errors with the code you posted ¯_(ツ)_/¯ – glls Sep 25 '17 at 16:33
  • thanks, it works as it is. But when the dueDate & dueDateString are in a aura:renderIf the above mentioned error arises... but I changed aura:renderIf to div classes.. and then everything works fine. Thanks. – Surya Chandra Rao Gandreddi Sep 25 '17 at 17:10

I was facing the same issue, the issue occurs due to the date format you are providing and the date format you are trying to set, both formats should be same, so i did the following changes in my code, Please refer it.

**Component**
<aura:attribute name="visitDate" type="String"/>

<ui:inputDate aura:id="Wellness Visit"  format="MM/dd/yyyy" value="{!v.visitDate}"  displayDatePicker="true" class="inpText"/>

**Helper**
//Function for formating date in MM/dd/yyyy format
toDateFormat: function(val) {
        debugger;

        if(val != undefined && val != '') {
            var dateTimeParts = val.split(' ');
            console.log('****dateTimeParts'+dateTimeParts);
            var dtParts = dateTimeParts[0].split('/');
            var obj = (dtParts[0].length == 1 ? '0'+dtParts[0] : dtParts[0])+'/'+(dtParts[1].length == 1 ? '0'+dtParts[1] : dtParts[1]) + '/' + dtParts[2]; 
            return obj;
        }
        else {
            return '';
        }
    }

//Getting values from apex controller and set visit date
component.set("v.visitDate", helper.toDateFormat(myobj.visit_date__c));

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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