Adding a table tag via JavaScript with a dashed parameter

Question

I am trying to add a Bootstrap Table table tag with Javascript. One of the parameters for the table tag is data-pagination. This method of adding it, is failing due to the -.

How can I work around this?

Desired Output:

<table id="mytable" data-pagination="true" class="table table-striped"></table>

My code:

var table_div = document.createElement('table');
table_div.id = 'mytable';
table_div.className = "table table-striped";
table_div.data-pagination = "true";
document.body.appendChild(table_div);

You should use .dataset.

SLaks
– SLaks

2017-11-16 15:55:47 +00:00
Commented Nov 16, 2017 at 15:55 — SLaks
– SLaks, Commented Nov 16, 2017 at 15:55
Possible duplicate of Set data attribute using JavaScript

evolutionxbox
– evolutionxbox

2017-11-16 16:01:08 +00:00
Commented Nov 16, 2017 at 16:01 — evolutionxbox
– evolutionxbox, Commented Nov 16, 2017 at 16:01

halfer · Accepted Answer · 2024-03-15 12:44:15Z

2

You could use the dataset in this case like :

table_div.dataset.pagination = true;

Code:

var table_div = document.createElement('table');
table_div.id = 'mytable';
table_div.className = "table table-striped";
table_div.dataset.pagination = "true";
document.body.appendChild(table_div);

console.log(document.body.innerHTML)

edited Mar 15, 2024 at 12:44

halfer

20.2k20 gold badges110 silver badges207 bronze badges

answered Nov 16, 2017 at 16:07

Zakaria Acharki

67.5k15 gold badges79 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Kostas · Accepted Answer · 2017-11-16 15:53:39Z

1

table_div.setAttribute('data-pagination', 'true')

answered Nov 16, 2017 at 15:53

Kostas

1,9031 gold badge16 silver badges22 bronze badges

1 Comment

evolutionxbox Over a year ago

Or table_div.dataset.pagination = true

Collectives™ on Stack Overflow

Adding a table tag via JavaScript with a dashed parameter

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related