You need to sign in to do that
Don't have an account?

onblur is not working in lightning component
Hello,
I have needed to write onblur event of div which is desingned to have a background image But this is not working.If some one have implemented this functionality then please share me.
I have needed to write onblur event of div which is desingned to have a background image But this is not working.If some one have implemented this functionality then please share me.
You can not use onBlur on the div but you can use "onmouseout" event on it.
<aura:component >
<p style="width: 100%; float:left; background-color: #000000;" onmouseout="{!c.bluractionJs}"> Test </p>
</aura:component>
bluractionJs : function(component, event, helper) {
alert('blur');
}
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks and Regards,
Deepali Kulshrestha
All Answers
Hi Niraj,
Greetings to you!
Please refer to the below links which might give you an idea of how to use onblur.
https://salesforce.stackexchange.com/questions/163381/how-to-add-onblur-events-in-div-tags-in-lightning-component
https://salesforce.stackexchange.com/questions/148369/click-outside-of-popover-to-hide
I hope it helps you.
Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.
Thanks and Regards,
Khan Anas
You can call "showSpinner" and "hideSpinner" method as per your requirement
<div class="slds-m-around_xx-large">
<lightning:spinner aura:id="mySpinner" style="position: fixed!important;" alternativeText="Processing.." title="Processing.." variant="brand" size="large" class="slds-show"/>
</div>
showSpinner: function (component, event, helper) {
console.log('show spinner');
var spinner = component.find("mySpinner");
console.log('spinnerspinner-='+spinner);
$A.util.removeClass(spinner, "slds-hide");
$A.util.addClass(spinner, "slds-show");
},
hideSpinner: function (component, event, helper) {
console.log('hide spinner');
var spinner = component.find("mySpinner");
$A.util.removeClass(spinner, "slds-show");
$A.util.addClass(spinner, "slds-hide");
},
You can not use onBlur on the div but you can use "onmouseout" event on it.
<aura:component >
<p style="width: 100%; float:left; background-color: #000000;" onmouseout="{!c.bluractionJs}"> Test </p>
</aura:component>
bluractionJs : function(component, event, helper) {
alert('blur');
}
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks and Regards,
Deepali Kulshrestha