mercredi 5 janvier 2022

Toggle a column within the table

I have been trying to toggle a column using the checkbox, but unable to write the function for that.

Please find my code below.

EmployeeTable
<script>
    var name = '<textarea rows=1 cols=10 maxlength="10"></textarea>';
    var addr = '<textarea rows=2 cols=30 maxlength="50"></textarea>';
    var sal = '<textarea rows=1 cols=10 maxlength="10"></textarea>';

    function displayResult() {

        var index = document.getElementById("Employee_Table").rows.length;
        if (index <= 5) {
            var new_row = '<td>' + index + '</td><td>' + name + '</td><td> ' + addr + '</td><td>' + sal + '</td>';
            document.getElementById("Employee_Table").insertRow(-1).innerHTML = new_row;
        }

    }
</script>
<table id="Employee_Table" border="3">

    <tr>
        <th class="No">S.no</th>
        <th class="name">Name</th>
        <th class="addr">Address</th>
        <th class="salar">Salary</th>
    </tr>

    <div id="ckbox">
        <input type="checkbox" name="salar" />Salary

        <button type="button " onclick="displayResult() ">new row</button>
</table>

I would appreciate if someone could help me figure it out.

Thanks in advance




Aucun commentaire:

Enregistrer un commentaire