显示运行的总文本框值'标签中的总和

时间:2017-11-14 01:50:00

标签: javascript php jquery

我想显示部门老虎机过滤员工的绩效值的总和和亲子关系。

当我向第二行添加值时,值会添加到第一行的总和。

有人能帮我找到代码上的编码问题???感谢。

这是我的计算视图。

This is my calculation view

这是PHP代码:

NpgsqlCommand command = new NpgsqlCommand("select * from Function1(:ID, :DATE1, :DATE2)",
    connection);
command.Parameters.Add(new NpgsqlParameter("ID", NpgsqlDbType.Integer));
command.Parameters.Add(new NpgsqlParameter("DATE1", NpgsqlDbType.Date));
command.Parameters.Add(new NpgsqlParameter("DATE2", NpgsqlDbType.Date));

command.Parameters[0].Value = id;
command.Parameters[1].Value = dt1;
command.Parameters[2].Value = dt2;

DataTable dtResults = new DataTable();
NpgsqlDataAdapter da = new NpgsqlDataAdapter(command);
da.Fill(dtResults);

这是我的javascript代码:

                      <tbody>

                        <?php

                        if(isset($_POST['filter'])){
                        $department = $_POST['department'];

                        $query1 = "SELECT * FROM employee_personal_details e INNER JOIN department_details a ON e.dep_id=a.dep_id WHERE dep_name = '$department' ";

                        $employees = mysqli_query($connection,$query1);

                        while ($list = mysqli_fetch_array($employees)) {



                            echo "<tr>";
                            echo "<td>".$list['emp_fullName']."</td>";          
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td><input type=\"text\" name=\"amount\" class=\"cal\" size=\"1\"></td>";
                            echo "<td id=\"sum\"></td>";
                            echo "<td id=\"prec\"></td>";


                        }
                    }
                    ?>

                </tbody>

1 个答案:

答案 0 :(得分:1)

您可以使用解决方案

$(document).ready(function () {
  $('.cal').keyup(function(){
    var sum = 0;
    var precentage = 0;
    $('.cal').each(function(){
      var curVal = parseFloat($(this).val());
      if(!isNaN(curVal) && curVal.length != 0 && curVal < 4){
        sum += curVal;
        precentage = (sum/21)*100;
      }
    });
    
    $('#sum').html(sum);
    $('#prec').html(precentage.toFixed(2));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="amount" class="cal" size="1">
<input type="text" name="amount" class="cal" size="1">
<input type="text" name="amount" class="cal" size="1">
<input type="text" name="amount" class="cal" size="1">
<input type="text" name="amount" class="cal" size="1">

SUM: <div id="sum"></div>
Precentage: <div id="prec"></div>

更新了解决方案

$(document).ready(function () {
  $('.cal').keyup(function(){
    var sum = 0;
    var precentage = 0;
    $(this).closest('tr').find('td').each(function(){
      var curVal = parseFloat($(this).find('.cal').val());
      if(!isNaN(curVal) && curVal.length != 0 && curVal < 4){
        sum += curVal;
        precentage = (sum/21)*100;
      }
    });

    $(this).closest('tr').find('td').find('.sum').html(sum);
    $(this).closest('tr').find('td').find('.prec').html(precentage.toFixed(2));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td>
      SUM: <div class="sum"></div>
      Precentage: <div class="prec"></div>
    </td>
  </tr>
  <tr>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td><input type="text" name="amount" class="cal" size="1"></td>
    <td>
      SUM: <div class="sum"></div>
      Precentage: <div class="prec"></div>
    </td>
  </tr>
</table>

希望这会对你有所帮助。