Link copied!

Table Page Examples

<div class="e-layout">
    <header class="e-layout__header">
        <h1 class="e-layout__title">Page Title Goes Here</h1>
    </header>
    <main class="e-layout__content">
        <section class="e-layout__section">
            <e-datagrid data="[{&quot;name&quot;:&quot;John&quot;,&quot;surname&quot;:&quot;Lennon&quot;,&quot;role&quot;:&quot;singer&quot;,&quot;band&quot;:&quot;The Beatles&quot;,&quot;editDisabled&quot;:false,&quot;deleteDisabled&quot;:true,&quot;editDisabledTooltip&quot;:&quot;Lennon cannot be edited&quot;,&quot;editUrl&quot;:&quot;http://example.com/edit?name=Lennon&quot;,&quot;followers&quot;:123456,&quot;income&quot;:56789.123,&quot;practice&quot;:0.0913,&quot;birthday&quot;:&quot;1940-10-09T07:30&quot;,&quot;editVisibility&quot;:false,&quot;duration&quot;:3,&quot;priority&quot;:2},{&quot;name&quot;:&quot;Ringo&quot;,&quot;surname&quot;:&quot;Starr&quot;,&quot;role&quot;:&quot;drums&quot;,&quot;band&quot;:&quot;The Beatles&quot;,&quot;editDisabled&quot;:true,&quot;deleteDisabled&quot;:false,&quot;editDisabledTooltip&quot;:&quot;Starr cannot be edited&quot;,&quot;editUrl&quot;:&quot;http://example.com/edit?name=Starr&quot;,&quot;followers&quot;:2345,&quot;income&quot;:56435.1,&quot;practice&quot;:0.111,&quot;birthday&quot;:&quot;1940-07-07T18:00&quot;,&quot;editVisibility&quot;:true,&quot;duration&quot;:80,&quot;priority&quot;:1},{&quot;name&quot;:&quot;George&quot;,&quot;surname&quot;:&quot;Harrison&quot;,&quot;role&quot;:&quot;guitar&quot;,&quot;band&quot;:&quot;The Beatles&quot;,&quot;editDisabled&quot;:true,&quot;deleteDisabled&quot;:false,&quot;editDisabledTooltip&quot;:&quot;Harrison cannot be edited&quot;,&quot;editUrl&quot;:&quot;http://example.com/edit?name=Harrison&quot;,&quot;followers&quot;:3456,&quot;income&quot;:51234,&quot;practice&quot;:0.1228,&quot;birthday&quot;:&quot;1943-02-25T05:39&quot;,&quot;editVisibility&quot;:false,&quot;duration&quot;:1600,&quot;priority&quot;:3},{&quot;name&quot;:&quot;Paul&quot;,&quot;surname&quot;:&quot;McCartney&quot;,&quot;role&quot;:&quot;bass&quot;,&quot;band&quot;:&quot;The Beatles&quot;,&quot;editDisabled&quot;:false,&quot;deleteDisabled&quot;:true,&quot;editDisabledTooltip&quot;:&quot;McCartney cannot be edited&quot;,&quot;editUrl&quot;:&quot;http://example.com/edit?name=McCartney&quot;,&quot;followers&quot;:4567,&quot;income&quot;:52347,&quot;practice&quot;:0.084,&quot;birthday&quot;:&quot;1942-06-18T11:00&quot;,&quot;editVisibility&quot;:false,&quot;duration&quot;:3601,&quot;priority&quot;:4}]">
                <e-datagrid-column head="Name" content-key="name"></e-datagrid-column>
                <e-datagrid-column head="Surname" content-key="surname"></e-datagrid-column>
                <e-datagrid-column head="Role" content-key="role"></e-datagrid-column>
            </e-datagrid>
        </section>
    </main>
</div>