0

I have created a salesforce standard lightning data table in which i am trying to restrict the user to select only one row... it is working as per the requirement when user select the particular row in the data section , but when user select the checkbox on the header then it is not behaving properly.... outcome in that scenario is except first row in the data section every another row getting selected.....is there any way to prevent user doing this in standard lightning data table.

Please find my code as below :

HTML:
<div style='height: 400px;'>
                    <lightning-datatable 
                        key-field='Id' data={data} 
                        onrowselection={handleRowSelection}
                        columns={columns} 
                        default-sort-direction={defaultSortDirection} 
                        sorted-direction={sortDirection}
                        sorted-by={sortedBy} 
                        onsort={onHandleSort}>
                    </lightning-datatable>
                </div>

JS code : //column:

@track columns = [
        { label: 'Fund Name', fieldName: 'Fund_Name__c', sortable: true },
        { label: 'Strategy', fieldName: 'Investment_Strategy__c',sortable: true },
        { label: 'Fund Code', fieldName: 'Global_Fund_Code__c',sortable: true },
        { label: 'Structure', fieldName: 'Structure__c',sortable: true },
        { label: 'Asset Class', fieldName: 'Asset_Class__c',sortable: true }
    ];

//code for preventing multiple selection as below :

handleRowSelection = event => {
        var selectedRows = event.detail.selectedRows;
        console.log('selectedRow=='+JSON.stringify(selectedRows));
        if (selectedRows.length > 1) {
            var el = this.template.querySelector('lightning-datatable');
            selectedRows = el.selectedRows = el.selectedRows.slice(1);
            event.preventDefault();
            return;
        }
    }

kindly help me to resolve this issue.

1
  • 1
    Hi Tiksha - Welcome to Salesfore Stackexchange. Could you please clarify on your question what have you attempted and what is not yet working? Oct 8, 2021 at 10:45

3 Answers 3

2

We need to add one check in lightning data table as max-row-select ='1'

1

max-row-selection="1"

0

You can use max-row-selection="1", but this changes the checkbox to a radio button; I have added few lines to your function, this handles the select all case as well:

rowSelectionHandler = (event) => {
        
        var selectedRows = event.detail.selectedRows;
        var el = this.template.querySelector('lightning-datatable');
        
        if (selectedRows.length > 1) {
            if(selectedRows.length == this.data.length){
                selectedRows = el.selectedRows = [];
            }else{
                selectedRows = el.selectedRows = el.selectedRows.slice(1);
            }
            event.preventDefault();
        }
        this.selectedRow = selectedRows;
    }

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .