JSFiddle - React, Tailwind, and code Playground

by Norlihazmey Ghazali

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<table id="table-style">
    <thead>
        <tr>
            <th data-field="state" data-checkbox="true"></th>
            <th data-field="id">Item ID</th>
        </tr>
        <tr>
            <td>
                <input type="checkbox" />
            </td>
            <td>5</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" />
            </td>
            <td>15</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" />
            </td>
            <td>10</td>
        </tr>
    </thead>
</table>

<button>Add to cart</button>

JavaScript

var arr;
$('button').click(function(){
    arr = $('#table-style').find('[type="checkbox"]:checked').map(function(){
          return $(this).closest('tr').find('td:nth-child(2)').text();
    }).get();
    
    console.log(arr);
});