how can I add numbers in an html table

Question

I'm trying to add a column of numbers in an HTML table. I don't receive an errors in the console, I simply do not get a sum. here is a snippet of the HTML, and the JS in question. As you can see each cell in the column has its own class, mile1, mile2, etc... There are 48 of these in the full HTML. The script runs without any problems and does what it should do, it just doesn't give a sum of the column "Miles".

<body>
    <div id="map" style="height:400px"></div>
    <div id="status"></div>
    <div id="results"></div>
    <div id="table"></div>
    <div id="td"</div>

    <div style=" text-align: center; text-indent: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;">

        <table width="20%" border="1" cellpadding="0" cellspacing="0" "border-color: #000000; border-style: solid; background-color: #ffffff;">
            <tr>
                <th>State</th>
                   <th>Miles</th>       

                <tr valign="top">
                <td style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"class="state1"><br />
                </td>
                <td style="border-color : #000000 #000000 #000000 #000000; border-style: solid;"class="mile1"><br />
                </td>
                <tr valign="top">
                    <td style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="state2"><br />
                    </td>
                    <td style="border-color : #000000 #000000 #000000 #000000; border-style: solid;" class="mile2"><br />
                    </td>
                    <tr valign="top">





                       var x =(stateMiles[state]);

                     (stateMiles[state])= parseFloat(x);    

                     var m = (stateMiles[state]);
                     var n = Number(m);
                     var r = Math.round(m);
                     (stateMiles[state]) = Number(m);
                     (stateMiles[state]) = Math.round(m);   



                        $("#results").append;
                        $(".state" + i).append(state);
                        $(".mile" + i).append(stateMiles[state]);

//here is what i have been trying //

        var numbers = [(stateMiles[state])];                                }

        function getSum(total, num) {
    return total + Math.round(num);
    document.getElementById("table").td(mile1,mile2) = numbers.reduce(getSum,0);

Answer 1

Sadly neither your code or your JSFiddle is a small / minimal working example.

Generally speaking you should be able to do what you want as long as you watch for the two following pitfalls:

A table has a tbody child-element (so a row is not a direct child of a table)
You might need to parse the content of a Cell into a number

Considering this, the following snippet gets a value from a table. Making it a sum of those should be done by simply running over the table domNode "array"

<table id="table">
    <tr><td>1</td><td>2</td></tr>
    <tr><td>3</td><td>4</td></tr>
</table>

To get the first value you need:

parseInt(document.getElementById("table").children[0].children[0].children[0].textContent)

The children chaining is table->tbody->tr->td

how can I add numbers in an html table

Question

1 answers

solution1
0 2016-05-19 19:06:23

how can I add numbers in an html table

Question

1 answers

solution1 0 2016-05-19 19:06:23

solution1
0 2016-05-19 19:06:23