[SalesForce] How to set setCustomValidity on Lightning:Input

Hallo I do not get it to set a custom validation on the lightning:input field.
Here is my code:
Component:

<aura:iteration items="{!v.mylines}" var="line">
<tr>
    <td data-label="Date" class="slds-form--inline">
        <lightning:input aura:id="myDate" type="date" name="date" class="nolabel" value="{!line.CustomField__c}" messageWhenBadInput="Date must be newer than..." onchange="{!c.checkIfValid}" />
    </td>
</tr>

Controller:

checkIfValid: function(component, event, helper){
  console.log("here we are");
  var lines = component.get('v.myLines');

  var inputfield = event.getSource();

  var inputvalue = event.getSource().get("v.value"); // get the right value
  if (inputvalue < lines[0].customfield__c) {
    console.log('its to small'); // this works

    inputField.setCustomValidity('wrong'); //do not get any message
    inputField.reportValidity();
  }
}

I have tried the same with the component.find('aura:id') but than of course I get all x elements.

The basic idea: I have x lines and in each line is one date value and if I change one of these date values I want to check if it is smaller than the first(line/header) value.
I'm thankful for any help

Thx the answer works. My new code is:

if (inputvalue < lines[0].customField__c) {
        console.log('its to small');
        inputField.setCustomValidity('wrong'); // works
    } else {
        console.log('its ok');  // get also this
        inputField.setCustomValidity('');
    }
inputField.reportValidity();

Now the issue is that the 'wrong' do not dissapear when I enter the else case.
I have also tried it like:

if (!inputField.get("v.validity").valid) {
    inputField.reportValidity();
}

Which gives me the correct values but if ones the 'wrong' message apear on the page it do not dissapear anymore

Best Answer

To me, it seems that the error is due to the Case-Sensitive nature of JavaScript. As you have used two different variables inputfield and inputField in your code, which are not the same (Letter F is in different case). Please change both variable names to the same case and see if that works.

var inputfield = event.getSource();

.........
.........
........

inputField.setCustomValidity('wrong'); //do not get any message
inputField.reportValidity();
Related Topic