function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
jagadeep kjagadeep k 

Add checkbox to nested array in lwc

Nested Array Component
Here is my js code for the component
import { LightningElement,api } from 'lwc';
export default class testPaginationNestedArray extends LightningElement {
    data = [];
    globalActions = [];
    columns = [];
    keyField;
    showPaginationTable = false;
    connectedCallback() {
        const actions = [
            { label: 'Show details', name: 'show_details' },
            { label: 'Delete', name: 'delete' },
           
        ];
       
        this.columns = ["Name", "Website", "Phone", "Amount", "Close At"];
        this.data = [
            ["Test Name 1", {"value": "testname1.com", "type": "url"}, {"value": "09898989801", "type": "phone"}, 230.45, "2021-02-28" ],
            ["Test Name 2", {"value": "testname2.com", "type": "url"}, {"value": "09898989802", "type": "phone"}, 240.5, "2021-01-28" ],
            ["Test Name 3", {"value": "testname3.com", "type": "url"}, {"value": "09898989803", "type": "phone"}, 250.65, "2021-03-28" ],
            ["Test Name 4", {"value": "testname4.com", "type": "url"}, {"value": "09898989804", "type": "phone"}, 260.4, "2021-02-28" ],
            ["Test Name 5", {"value": "testname5.com", "type": "url"}, {"value": "09898989805", "type": "phone"}, 270, "2021-01-28" ],
            ["Test Name 6", {"value": "testname6.com", "type": "url"}, {"value": "09898989806", "type": "phone"}, 280.45, "2021-03-28" ],
            ["Test Name 7", {"value": "testname7.com", "type": "url"}, {"value": "09898989807", "type": "phone"}, 290.5, "2021-02-28" ],
            ["Test Name 8", {"value": "testname8.com", "type": "url"}, {"value": "09898989808", "type": "phone"}, 130.65, "2021-01-28" ],
            ["Test Name 9", {"value": "testname9.com", "type": "url"}, {"value": "09898989809", "type": "phone"}, 330.4, "2021-03-28" ],
            ["Test Name 10", {"value": "testname10.com", "type": "url"}, {"value": "09898989810", "type": "phone"}, 430, "2021-02-28" ]
        ];
        this.globalActions = [
            {label: "Delete", type: "delete"},
            {label: "Hide", type: "hide"},
            {label: "Edit", type: "edit"}
        ];
        this.keyField=true;
        this.showPaginationTable = true;
    }
    handleRowAction(event) {
        alert("Row Action Fired!\nAction Name: " + event.detail.actionName + "\nRow: " + JSON.stringify(event.detail.row));
    }
    handleGlobalAction(event) {
        alert("Global Action Fired!\nAction Type: " + event.detail.actionType + "\nSelected Rows: " + JSON.stringify(event.detail.selectedRows));
    }
    handleSave(event) {
        alert("Inline Edit Save Action Fired!\Draft Values: " + JSON.stringify(event.detail.draftValues));
    }
}
Here is my html code for the component
<template>
    <div class="demoContainer">
        <h2 class="slds-text-heading_medium slds-var-m-bottom_medium">Pagination Datatable - With data structure type of
            nested array Enhanced</h2>
        <template if:true={showPaginationTable}>
            <c-pagination-datatable-full structure-type="2" table-columns={columns} table-data={data} key-field={keyField}
                rows-per-page="10" insert-numbered-column="true" show-page-numbers="true" first-last-buttons="true"
                previous-next-buttons="true" numbered-buttons="true" show-filters="true" max-number-of-index-buttons="5"
                dynamic-rows-per-page="true" onrowaction={handleRowAction} show-checkbox-column="true"
                global-actions={globalActions} onglobalaction={handleGlobalAction} onsave={handleSave} >
            </c-pagination-datatable-full>
        </template>
    </div>
 
</template>
SwethaSwetha (Salesforce Developers) 
HI Jagadeep,
Recommend reviewing https://salesforce.stackexchange.com/questions/370721/lwc-checkbox-read-only-reset
https://salesforce.stackexchange.com/questions/257727/implement-three-state-checkbox-using-lwc