I have two fields StartDate and EndDate. I have to validate the fields and show error on lightning component. EndDate field should not be greater than StartDate.

My Code:

        var startDateField = document.getElementById("StartDate").value;
        var endDateField = document.getElementById("EndDate").value;

        if ((Date.parse(EndDate) <= Date.parse(StartDate))) {
            alert("End date should be greater than Start date");
            document.getElementById("EndDate").value = "";

Getting below Error:

Uncaught Action failed: [Cannot read property 'value' of null]

  • 1
    please confirm that you have element with Id "end" available . – Samir Feb 5 '18 at 12:25

A couple of things:

  1. You're not referencing the correct variable names...you have startDateField and endDateField defined as variable names, but your if statement is attempting to evaluate variables named EndDate and StartDate - these variables are not defined.
  2. In general, rather than using document.getElementById(), use the aura:id attribute when defining your HTML elements to establish a local ID, and then reference that local ID using component.find().
    Reference: Component IDs

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