+ Start a Discussion
Narsimha RaoNarsimha Rao 

Page automatically refreshes when clicked on lightning datatable column header

I have a lightning:datatable on my lightning component and the component is hosted on visualforce page to be available on classic. Everything works fine except when I try to access the default header actions(Wrap text & Clip text) of a column by clicking on it, the entire page refreshes for no reason. What do I do to avoid that? Also, it works fine when trying the same thing in lightning experience. Any suggestions?

Component Code:
<aura:component>
<aura:attribute name="demodata" type="Object"/>
<aura:attribute name="democolumns" type="List"/>
<aura:handler name="init" value="{!this}" action="{!c.init}"/>
<lightning:datatable data="{!v.demodata}" 
    columns="{!v.democolumns}" 
    keyField="id"
    onrowselection="{!c.getSelectedAccName}"/>
</aura:component>
Controller Code:
({
init: function (cmp, event, helper) {
cmp.set('v.democolumns', [
            {label: 'Account Name', fieldName: 'accountName', type: 'text'},
            {label: 'Industry', fieldName: 'industry', type: 'text'},
            {label: 'Account Number', fieldName: 'accountNumber', type: 'text'}
        ]);
    cmp.set('v.demodata', [{
            id: 'a',
            accountName: 'Edge Communications',
            industry: 'Education',
            accountNumber: 'CD451796'
        },
        {
            id: 'b',
            accountName: 'GenePoint',
            industry: 'Electronics',
            accountNumber: 'CC978213'
        }]);
},
getSelectedAccName: function (cmp, event) {
    var selectedAccRows = event.getParam('selectedRows');
    for (var i = 0; i < selectedAccRows.length; i++){
        alert(selectedAccRows[i].accountName+" is selected");
    }
}
Sample Reference image in Lightning
User-added image
 
Best Answer chosen by Narsimha Rao
NagendraNagendra (Salesforce Developers) 
Hi Narasimha,

Sorry for this issue you are facing.

May I request you please confirm if you have form tag in your visual force page?

If yes, then I would suggest you please give a try by removing the form tag which might be probably causing the issue.

Hope this helps.

Kindly mark this as solved if the reply was helpful.

Thanks,
Nagendra

All Answers

NagendraNagendra (Salesforce Developers) 
Hi Narasimha,

Sorry for this issue you are facing.

May I request you please confirm if you have form tag in your visual force page?

If yes, then I would suggest you please give a try by removing the form tag which might be probably causing the issue.

Hope this helps.

Kindly mark this as solved if the reply was helpful.

Thanks,
Nagendra
This was selected as the best answer
Narsimha RaoNarsimha Rao
Nagendra, Thanks for the reply! 
I figured out that the <apex: form> on the visualforce page was actually causing the problem a couple of weeks ago. 

Thanks!