Question

任何人都可以帮助我添加基本工资和津贴I，并将其插入总日费率而无需单击按钮。这是我的PHP代码这是我的用户界面Screen Shot 代码：

<?php

    $connection = mysql_connect("localhost", "root", "");

        $db = mysql_select_db("laboursalary", $connection);
        if(isset($_POST['submit'])){


    $ID = $_POST['ID'];
    $Name = $_POST['Name'];
    $Location = $_POST['Location'];
    $Category = $_POST['Category'];
    $LabourSupplier = $_POST['LabourSupplier'];
    $Home = $_POST['Home'];
    $Mobile = $_POST['Mobile'];
    $BasicSalary = $_POST['BasicSalary'];
    $Allowance1 = $_POST['Allowance1'];
    $Allowance2 = $_POST['Allowance2'];
    $DayRate = $_POST['$DayRate'];
    $OTrate = $_POST['OTrate'];
    if($ID !=''||$Name !=''){

    $query = mysql_query("insert into attendance(ID, Name, Location, Category,LabourSupplier,Home,Mobile,BasicSalary,Allowance1,Allowance2,DayRate,OTrate) values ('$ID','$Name','$Location','$Category','$LabourSupplier','$Home','$Mobile','$BasicSalary','$Allowance1','$Allowance2','$DayRate','$OTrate')");
    echo "<br/><br/><span>Data Inserted successfully...!!</span>";
    }
    else{
    echo "<p>Insertion Failed <br/> Some Fields are Blank....!!</p>";   
    }

    }

    mysql_close($connection);
?>

输入基本工资和津贴1的值后，我想自动在日费率中添加这两个。
这是我的 HTML 代码。

<form id="details" action="" method="POST">

    <fieldset> ID:
      <input class="input" type="text" name="ID" value="" />
      </fieldset>
    <fieldset> Name:
      <input class="input" type="text" name="Name" value="" />
    </fieldset>
    <fieldset> Location:
      <input class="input" type="text" name="Location" value="" />
    </fieldset>
    <fieldset> Category:
      <input class="input" type="text" name="Category" value="" />
    </fieldset>
    <fieldset> Labour Supplier:
     <input class="input" type="text" name="LabourSupplier" value="" />
    </fieldset>
    <fieldset> Telephone:
     <input class="input" type="text" name="Home" value="" />
    </fieldset>
    <fieldset>Mobile:
      <input class="input" type="text" name="Mobile" value="" />
    </fieldset>
    <fieldset> Basic Salary:
     <input class="input" type="number" name="BasicSalary" value="" />
    </fieldset>
    <fieldset> Allowance I:
    <input class="input" type="number" name="Allowance1" value="" />
    </fieldset>
    <fieldset>Allowance II:
     <input class="input" type="number" name="Allowance2" value="" />
    </fieldset>
    <fieldset>Total Day Rate:
     <input class="input" type="number" name="DayRate" value="" />
    </fieldset>
    <fieldset>OT Rate:
     <input class="input" type="number" name="OTrate" value="" />
    </fieldset>
    <fieldset>
      <button name="submit" type="submit" id="submit">Insert</button>
      <button onclick="goBack()" name="Back" type="back" id="details-back">Back</button>
    </fieldset>

  </form>

Answer 1

这就是使用提交发布的方式，因为这些都是_POST值...虽然没有按下按钮就可以实现这一点，但JS / Angular / J Query / AJAX ......

....
$BasicSalary = $_POST['BasicSalary']; 
$Allowance1 = $_POST['Allowance1'];
$Allowance2 = $_POST['Allowance2'];
$DayRate = $_POST['$DayRate'];
$OTrate = $_POST['OTrate'];

//Set a new variable with the addition of the two `Basic Salary` and  `Allowance 1` 
//for the insertion into your column `dayRate`   
$adustedDayRate = $BasicSalary + $Allowance1;
if($ID !=''||$Name !=''){

    if($query != false){
        $query = mysql_query("INSERT INTO `attendance` (ID, Name, Location, Category,LabourSupplier,Home,Mobile,BasicSalary,Allowance1,Allowance2,DayRate,OTrate) values ('$ID','$Name','$Location','$Category','$LabourSupplier','$Home','$Mobile','$BasicSalary','$Allowance1','$Allowance2','$adustedDayRate','$OTrate')");
    echo "<br/><br/><span>Data Inserted successfully...!!</span>";
    }esle{ $_SESSION['err'] = "ERROR: ".--- MySQL error handle here --- }
}
else{
echo "Some Fields are Blank....!!</p>";   
}

}

mysql_close($connection);

使用Angular ，您可以在“DayRate”的表单输入中放置占位符元素，然后为要添加的两个输入的ng-model元素添加回调。这里有类似的东西：

<div ng-app="">

<p>BasicSalary : <input type="number" ng-model="BasicSalary" placeholder="Basic Salary"></p>

<p>AllowanceI  : <input type="number" ng-model="AllowanceI" placeholder="Allowance I"></p>

<p>DayRate   : <input type="number" ng-model="DayRate" placeholder="{{BasicSalary -- AllowanceI}}"></p>

您的代码如下：

<fieldset> Basic Salary:
 <input class="input" type="number" ng-model="BasicSalary" name="BasicSalary" value="" />
</fieldset>
<fieldset> Allowance I:
<input class="input" type="number" ng-model="Allowance1" name="Allowance1" value="" />
</fieldset>
<fieldset>Allowance II:
 <input class="input" type="number" name="Allowance2" value="" />
</fieldset>
<fieldset>Total Day Rate:
 <input class="input" type="number" name="DayRate" placeholder="{{ BasicSalary -- Allowance1 }}" value="" />
</fieldset>

这是一个角度方法的工作小提琴，只需使用composer或托管链接将角度库添加到服务器，Angular库元素不需要额外的JS。您可以在输入另外两个组合输入时更改DayRate的值。 https://jsfiddle.net/qkpfb90o/1/

希望这有帮助！

Answer 2

据我了解您的问题，您的 HTML 代码应该是，

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<form id="details" action="" method="POST">
    <fieldset> ID:
      <input class="input" type="text" name="ID" value="" />
      </fieldset>
    <fieldset> Name:
      <input class="input" type="text" name="Name" value="" />
    </fieldset>
    <fieldset> Location:
      <input class="input" type="text" name="Location" value="" />
    </fieldset>
    <fieldset> Category:
      <input class="input" type="text" name="Category" value="" />
    </fieldset>
    <fieldset> Labour Supplier:
     <input class="input" type="text" name="LabourSupplier" value="" />
    </fieldset>
    <fieldset> Telephone:
     <input class="input" type="text" name="Home" value="" />
    </fieldset>
    <fieldset>Mobile:
      <input class="input" type="text" name="Mobile" value="" />
    </fieldset>
    <fieldset> Basic Salary:
     <input class="input" type="number" name="BasicSalary" value="0" id="bassal" />
    </fieldset>
    <fieldset> Allowance I:
    <input class="input" type="number" name="Allowance1" value="0" id="all1" />
    </fieldset>
    <fieldset>Allowance II:
     <input class="input" type="number" name="Allowance2" value="0" id="all2" />
    </fieldset>
    <fieldset>Total Day Rate:
     <input class="input" type="number" name="DayRate" value="" id="DayRate" />
    </fieldset>
    <fieldset>OT Rate:
     <input class="input" type="number" name="OTrate" value="" />
    </fieldset>
    <fieldset>
      <button name="submit" type="submit" id="submit">Insert</button>
      <button onclick="goBack()" name="Back" type="back" id="details-back">Back</button>
    </fieldset>
  </form>
<script >
    $(document).ready(function (){
        $('#bassal').on('input', function() {
            $('#DayRate').val(parseInt($('#bassal').val()) + parseInt($("#all1").val()) + parseInt($("#all2").val()));
        });
        $('#all1').on('input', function() {
            $('#DayRate').val(parseInt($('#bassal').val()) + parseInt($("#all1").val()) + parseInt($("#all2").val()));
        });
        $('#all2').on('input', function() {
            $('#DayRate').val(parseInt($('#bassal').val()) + parseInt($("#all1").val()) + parseInt($("#all2").val()));
        });
    });
</script>

我添加了jQuery，它可以完成你的工作，而且你不需要在PHP端添加。

Answer 3

你也可以试试这个。

<form id="details" action="" method="POST">
    <fieldset> ID:
        <input class="input" type="text" name="ID" value="" />
    </fieldset>
    <fieldset> Name:
        <input class="input" type="text" name="Name" value="" />
   </fieldset>
   <fieldset> Location:
       <input class="input" type="text" name="Location" value="" />
   </fieldset>
   <fieldset> Category:
      <input class="input" type="text" name="Category" value="" />
   </fieldset>
  <fieldset> Labour Supplier:
      <input class="input" type="text" name="LabourSupplier" value="" />
  </fieldset>
  <fieldset> Telephone:
      <input class="input" type="text" name="Home" value="" />
  </fieldset>
  <fieldset>Mobile:
      <input class="input" type="text" name="Mobile" value="" />
  </fieldset>
  <fieldset> Basic Salary:
      <input class="input" type="number" name="BasicSalary" value="" id="BasicSalary" onkeyup="doSum()"/>
  </fieldset>
  <fieldset> Allowance I:
      <input class="input" type="number" name="Allowance1" value="" id="Allowance1" onkeyup="doSum()"/>
  </fieldset>
  <fieldset>Allowance II:
      <input class="input" type="number" name="Allowance2"  />
  </fieldset>
  <fieldset>Total Day Rate:
      <input class="input" type="number" name="DayRate" value="" id="DayRate" />
  </fieldset>
  <fieldset>OT Rate:
      <input class="input" type="number" name="OTrate" value="" />
  </fieldset>
  <fieldset>
      <button name="submit" type="submit" id="submit">Insert</button>
      <button onclick="goBack()" name="Back" type="back" id="details-back">Back</button>
  </fieldset>

<script>
function doSum() {
    var Allowance1 = isNaN(document.getElementById('Allowance1').value) ? document.getElementById('Allowance1').value : 0;
    var BasicSalary = isNaN(document.getElementById('BasicSalary').value) ? document.getElementById('BasicSalary').value : 0;
    var tot = parseInt(Allowance1) + parseInt(BasicSalary);
    document.getElementById('DayRate').value = tot;
}
</script>

无按钮点击即可获得添加

3 个答案: