Count multiple number in each table

Question

I have dynamic table. That from php loop. Here is the example from browser source code :

 <table class="table">
    <thead>
        <tr>
            <td> No </td>
            <td> Full Name </td>
            <td> Attendance Date </td>
            <td> In Time </td>
            <td> Out Time </td>
            <td> Waktu Lebih </td>
        </tr>
    </thead>
    <tbody>
        <tr>
    <td>1</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-01</td>
    <td class="jammasuk">
        07:00:00    </td>                                                                           
    <td class="jampulang">
    23:00:00    </td>
    <td class="lebih">08:00</td>

    </tr>
         <tr>
    <td>2</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-02</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>
         <tr>
    <td>3</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-03</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>

             <tr>

            <td colspan="4"> </td>
            <td>Total Jam Lebih</td>
            <td>
             <input name="jamlebih" type="text" readonly disabled class="jmljam" />
            </td>
        </tr>
         <tr>
            <td colspan="4"> </td>
            <td>Ro Yang DiDapatkan</td>
             <td>
             <input name="dapetro" type="text" readonly class="ronya" />
             </td>
        </tr>
            </tbody>
</table>

    <table class="table">
    <thead>
        <tr>
            <td> No </td>
            <td> Full Name </td>
            <td> Attendance Date </td>
            <td> In Time </td>
            <td> Out Time </td>
            <td> Waktu Lebih </td>
        </tr>
    </thead>
    <tbody>
        <tr>
    <td>4</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-04</td>
    <td class="jammasuk">
        07:00:00   </td>                                                                            
    <td class="jampulang">
    22:00:00   </td>
    <td class="lebih">07:00</td>

    </tr>
         <tr>
    <td>5</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-05</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>
         <tr>
    <td>6</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-06</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>
         <tr>
    <td>7</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-07</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>
         <tr>
    <td>8</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-08</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>
         <tr>
    <td>9</td>
    <td>[1105321] - AL SHIFAUL LATIFAH</td>
    <td>2016-09-09</td>
    <td class="jammasuk">
        -    </td>                                                                          
    <td class="jampulang">
    -    </td>
    <td class="lebih">00:00</td>

    </tr>

             <tr>

            <td colspan="4"> </td>
            <td>Total Jam Lebih</td>
            <td>
             <input name="jamlebih" type="text" readonly disabled class="jmljam" />
            </td>
        </tr>
         <tr>
            <td colspan="4"> </td>
            <td>Ro Yang DiDapatkan</td>
             <td>
             <input name="dapetro" type="text" readonly class="ronya" />
             </td>
        </tr>
            </tbody>
</table>

And I have this JavaScript

function getro(){
    var totaljamlebih   = moment($('.jmljam').val(),'HH:mm');
    var per_ro          = '08:00';
    var a = moment.duration(totaljamlebih, "HH:mm").asSeconds();
    var b = moment.duration(per_ro, "HH:mm").asSeconds();
    var rodapet = a / b;
    if(rodapet < 1) {
        $('.claim').hide()
    }
    $('.ronya').val(parseInt(rodapet)); 
}
function timemanage(){
    var total = moment().startOf('day');
    $('.lebih').each (function() {
        var value = $(this).text();
        var thisMoment = moment(value, 'HH:mm', true);
        if(thisMoment.isValid()){
          total.add(thisMoment);
          $(".jmljam").val(total.format("HH:mm")); 
      }
  });
}

$(document).ready(function(){
    timemanage();
    getro();    
});

You can see from my tables, the first table and the second table have different values.

i'm trying to calculate the values from each table with my js, than put the result in .jmljam and ronya at each table. But, with my script above .jmljam and .ronya is the result of both table values. I wan't to divide it, can you show me how?

My Fiddle https://jsfiddle.net/s9wfh9ye/8/

Answer 1

     function getro()
    {
  $("table").each(function() {
  $this = $(this);
        var totaljamlebih   = moment($this.find('.jmljam').val(),'HH:mm');
        var per_ro          = '08:00';
        var a = moment.duration(totaljamlebih, "HH:mm").asSeconds();
        var b = moment.duration(per_ro, "HH:mm").asSeconds();
        var rodapet = a / b;
        if(rodapet < 1)
            {$this.find('.claim').hide()}

        $this.find('.ronya').val(parseInt(rodapet)); 
    });
    }
function timemanage(){
$("table").each(function() {
  $this = $(this);
    var total = moment().startOf('day');
        $this.find('.lebih').each (function() {
            var value = $this.find(this).text();
      var thisMoment = moment(value, 'HH:mm', true);
            if(thisMoment.isValid()){
          total.add(thisMoment);
                    $this.find(".jmljam").val(total.format("HH:mm")); 
            }
        });
    });
    }

This should work =]

Update with this and it should count the hours and mins without days. =]

function timemanage(){
var start = moment().startOf('day');
$("table").each(function() {
  $this = $(this);

    var total = moment().startOf('day');
        $this.find('.lebih').each (function() {
            var value = $this.find(this).text();
      var thisMoment = moment(value, 'HH:mm', true);
            if(thisMoment.isValid()){
          total.add(thisMoment);

                var diff = Math.abs(total - start);
              var dayss = Math.floor((diff/(1000 * 60 * 60 * 24)))* 24 ;
              var hourss = Math.floor((diff/(1000 * 60 * 60) % 24));
              var minss = Math.floor((diff/(1000 * 60) % 60));

                    $this.find(".jmljam").val((dayss+hourss)+":"+minss); 
            }
        });
    });
    }