@Sarang Try this.. i hope it solves your issue
toggleApplication :
<aura:application extends="force:slds">
<aura:attribute name="ListOfItems" type="List" default="[1,2,3]"/>
<aura:attribute name="index" type="String"/>
<table>
<tr>
<th>
Actions
</th>
</tr>
<aura:iteration items="{!v.ListOfItems}" var="item" indexVar="index">
<tr>
<td>
<div aura:id="dropdown" class="slds-dropdown-trigger slds-dropdown-trigger--click">
<a data-index="{!index}" onclick="{!c.showAction}">
<lightning:icon iconName="utility:down" size="xx-small"/>
</a>
<div class="slds-dropdown slds-dropdown--left">
<ul class="slds-dropdown__list" role="menu">
<li class="slds-dropdown__item" role="presentation">
<a href="javascript:void(0);" role="menuitem" data-index="{!index}" onclick="{!c.cloneSobjectRecord}">
<span class="slds-truncate">Clone</span>
</a>
</li>
<li class="slds-dropdown__item" role="presentation">
<a href="javascript:void(0);" role="menuitem" data-index="{!index}" onclick="{!c.changeArchive}">
<span class="slds-truncate">Archive</span>
</a>
</li>
</ul>
</div>
</div>
</td>
</tr>
</aura:iteration>
</table>
</aura:application>
toggleAppController.js :
({
showAction : function(cmp, event, helper) {
helper.toggleDropdown(cmp,event);
},
cloneSobjectRecord : function(cmp,event,hepler){
console.log("cloneSobjectRecord");
},
changeArchive : function(cmp,event,helper){
console.log("Archive record");
}
})
toggleAppHelper.js
({
toggleDropdown : function(cmp,event){
var index = cmp.get("v.index");
if(index){
this.closeDropdown(cmp,event);
}
var dropdown = cmp.find('dropdown');
if(!Array.isArray(dropdown)){
dropdown = [dropdown];
}
var index = event.currentTarget.getAttribute("data-index");
cmp.set("v.index",index);
$A.util.toggleClass(dropdown[index], 'slds-is-open');
event.stopPropagation();
},
closeDropdown: function(cmp,event) {
var dropdown = cmp.find('dropdown');
if(!Array.isArray(dropdown)){
dropdown = [dropdown];
}
var index = cmp.get("v.index");
for(var i = 0; i < dropdown.length; i++){
if(i != parseInt(index)){
$A.util.removeClass(dropdown[index], 'slds-is-open');
}
}
}
})
toggleAppRenderer.js :
({
afterRender: function (cmp,helper) {
this.superAfterRender();
helper.windowClick = $A.getCallback(function(event){
if(cmp.isValid()){
helper.closeDropdown(cmp,event);
}
});
document.addEventListener('click',helper.windowClick);
},
unrender: function (cmp,helper) {
this.superUnrender();
document.removeEventListener('click',helper.windowClick);
}
})
The browser's same-origin policy prevents a page from accessing content or code in another page loaded from a different origin (protocol + port + host).
You can use postMessage() to communicate between your Lightning Component and the content of the iframe. See this blog post for details.
In Spring17, you can also use the Lightning Container Component, but be aware that it is in Developer Preview.
Best Answer
You can try to set the focus by using
.focus
method in the button click function. Check this fiddle link I have created.https://www.w3schools.com/jsref/met_html_focus.asp