I have an lightning:input
like this (already tried with not(v.customAddress)
):
<form class="slds-form--inline slds-m-bottom--small">
<lightning:select
aura:id="sendTo"
label="{! $Label.c.Send_To }"
name="{! $Label.c.Send_To }"
>
<option value="{! null }" selected="{! true }">{! 'Select a mail' }</option>
<aura:iteration items="{! v.addresses }" var="address" >
<option value="{! address.id }">
{! join(' ', join(', ',address.street, address.houseNumber), address.postalCode, address.city) }
</option>
</aura:iteration>
</lightning:select>
<lightning:buttonIcon
name="Add selected address"
iconName="utility:add"
alternativeText="{! 'Select address' }"
onclick="{! c.selectAddress }"
/>
</form>
<!-- STREET -->
<form class="slds-form--inline slds-m-bottom--small">
<lightning:input
aura:id="street"
type="text"
label="{! 'Street address' }"
name="{! 'street' }"
onchange="{! c.updateAddress }"
disabled="{! !v.customAddress }"
value="{! v.address.street }"
required="{! true }"
/>
</form>
An aura:attribute
like this:
<aura:attribute
name="customAddress"
type="Boolean"
default="true"
required="false"
access="private"
/>
And a Javascript function in my controller like this:
({
selectAddress: function(component, event, helper) {
const input = component.find('sendTo'); // A lightning:select
const addressId = input.get('v.value'); // The default lightning:option has a {! null } value
if (addressId && addressId.trim() !== '') {
component.set('v.address', /* myProcessedObject */);
component.set('v.customAddress', false); // lightning:input has to be disabled
} else {
component.set('v.address', {});
component.set('v.customAddress', true); // lightning:input has to be enabled
}
}
})
The first time my function is called AND component.set('v.customAddress', false);
is reached, field is not disabled.
Sometimes, when component.set('v.customAddress', true);
is reached, the field is disabled.
Example:
I selected the address in the dropdown and clicked +
=> lightning:input
is field and disabled OK
I selected the null value from the dropdown and clicked +
=> lightning:input
is cleaned but not enable NOK
With a different behaviour of the click function:
selectAddress: function(component, event, helper) {
const input = component.find('sendTo');
const addressId = input.get('v.value');
if (addressId && addressId.trim() !== '') {
component.find("street").set("v.disabled", true);
} else {
component.find("street").set("v.disabled", false);
}
}
Answering comment: https://salesforce.stackexchange.com/a/156171/37707:
Best Answer
could you just try this one to disable and enable?