CODEWITHSUNDEEP
phpjavascriptjquery
auicsc
auicsc

Reputation: 297

Sum up 2 values created dynamically in PHP

I have a table created dynamically from the DB enter image description here

I am trying to get sum up the value I select in the own evaluation field and the value next to it in the same row and display it in the Gap field right away.

The code I am using to fill those three columns is :

            echo "<td class='evaluation'>";
                echo "<select class='ownlevelselect' id='ownlevelselect' name='level-".$compi['Competence_ID']."' >";
                    echo "<option value=''>--</option><option value='1'>1</option><option value='2'>2</option><option value='3'>3</option><option value='4'>4</option><option value='5'>5</option>";
                echo "</select>";
                echo '<a target="_blank" href="'.INDEX.'?categ='.$_GET['categ'].'&action='.$_GET['action'].'&subaction=viewlevels'.'&levels='.$compi['Competence_ID'].'">';
                echo '<img class="linkki" src="'.KUVAT.'paivita.gif" alt="'._("tiedot").'" title="'._("What is this?").'"/></a>';
                            echo "</td>";
            echo "<td class='mefly'>";
                echo $compi['actual_level'];        
            echo "</td>";

            echo "<td class='gap'>";
                echo "<input type='text' readonly style='width:20px;'>";
            echo "</td>";

I tried this Jquery code as suggested by silkfire, but nothing changed..

$(function() {
       $(document).on('change', 'td.evaluation select', function() {
          var gap = $(this).val() + $(this).parent('tr').find('td.mefly').text();

          $(this).parent('tr').find('td.gap input:text').val(gap);
       });
    });

</script>

Upvotes: 1

Views: 429

Answers (1)

silkfire
silkfire

Reputation: 25935

Give those three cells (td) a class name, e.g. "evaluation", "mefly" and "gap".

Then bind an event to the evaluation select:

$(function() {
   $(document).on('change', 'td.evaluation select', function() {
      var gap = parseInt($(this).val()) + parseInt($(this).parents('tr').find('td.mefly').text());

      $(this).parents('tr').find('td.gap input:text').val(gap);
   });
});

Upvotes: 2

Related Questions