BDT - fixcwidth

Basic Data Table

v 2.1.2

Fix Cell Width ⟷

<div id="basicdatatable"></div>
<table border="1" width="100%" cellspacing="0" cellpadding="3">
	<!-- FIX CELL WIDTH -->
	<thead ref="toFix">
		<tr>
			<!-- ignore calc fix (if exists width attribute) -->
			<th width="50px">No.</th>
			<!-- this TAG will be calculated -->
			<th>
				<bdt-sort type="number" field="fld_ID" @sorting="sorting">ID</bdt-sort>
			</th>
			<th>
				<bdt-sort field="fld_Name" @sorting="sorting">Name</bdt-sort>
			</th>
			<th>
				<bdt-sort type="date" field="fld_Date_Iso" @sorting="sorting">Date</bdt-sort>
			</th>
		</tr>
	</thead>
	<tbody>
		<tr v-for="(item, index) in pageItems" :key="item.fld_ID">
			<td align="center"> {{ ((page -1) * limit) +index +1 }}. </td>
			<td> {{ item.fld_ID }} </td>
			<td> {{ item.fld_Name }} </td>
			<td> {{ item.fld_Date_Iso }} </td>
		</tr>
	</tbody>
</table>

<!-- PAGINATION -->
<bdt-pagination width="2.5em" :limit="limit" :page="page" :pages="pages" :btn-final="true" :btn-once="true" @set-page="setPage" @set-limit="setLimit" />
import basicDataTable from "https://api.pim.sk/api/basic-data-table/bdt.min.mjs"

const bdt = new basicDataTable({
	id: "bdtBex",
	selector: "#basicdatatable",
	items: data,
	template: template
});