JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Table › Update only Table columns (th) › Reply To: Update only Table columns (th)
yavordashewHi Johnny,
Happy New Year best wishes from Smart UI Team!
There is a way that you can access the column headers properties and change them according to your needs.
I have made a code snippet for you to showcase one way of doing this:
<script>
let clickHandler = function(){
const table = document.getElementById(‘table’)
table.columns = [
{ label: ‘ID your language’, dataField: ‘id’, dataType: ‘number’ },
{ label: ‘Name in Another Language’, dataField: ‘firstName’, dataType: ‘string’ },
{ label: ‘Last Name in Another Language’, dataField: ‘lastName’, dataType: ‘string’ },
{ label: ‘Product Name in Another Language’, dataField: ‘productName’, dataType: ‘string’ },
{ label: ‘Qunatity in Another Language’, dataField: ‘quantity’, dataType: ‘number’ }
]
console.log(‘Column Headers Changed’)
}
</script>
<body>
<smart-table id=”table”></smart-table>
<button onclick=”clickHandler()”>Click Me</button>
</body>
Please, do not hesitate to contact us if you have any additional questions.
Best regards,
Yavor Dashev
Smart UI Team
https://www.htmlelements.com/