undefined index on javascript dynamic variables when passing to php form

Question

<form action="testing.php" method="POST" id="addreciept" name="addreciept">
Unit<input name="unit1" type="text" id="unit1" size="17" onkeyup="calc()"   value="0"/>
Rate<input name="rate1" type="text" id="rate1" size="17" value="0" onkeyup="calc()"  />
Amount<input name="amount1" type="text" id="amount1" size="17"  disabled="true"   />
Total Amount: <input type="text" name="totalamount" id="totalamount" disabled="true"   value=""> 
Amount Paid: <input type="text" name="amount_paid" id="amount_paid" onkeyup="calc_balance()" />
Balance: <input type="text" name="balance" id="balance" disabled="true"  value="0"> 
<center>
<input type="submit" value="Save " class="button" >
</center>
</form>

<script>
function calc()
{
unit=document.getElementById('unit1').value;
rate=document.getElementById('rate1').value;
amount=unit*rate;
document.getElementById('amount1').value=amount;
total_amount=document.getElementById('amount1').value;
document.getElementById('totalamount').value=total_amount;
}
function calc_balance()
{
tota_amount=document.getElementById('totalamount').value;
paid_amount=document.getElementById('amount_paid').value;
document.getElementById('balance').value=tota_amount-paid_amount;
}
</script>

I recently tested the script posted on net , it works, but I guess I am doing something wrong :'( i am badly stuck in it, because the dynamic variables like, amount1, totalamount & balance are causing error of undefined index amount1 etc etc

plz figure it out :(

php is just simple >>

<?php
echo $_POST['unit1'];
echo $_POST['rate1'];
echo $_POST['amount1'];
?>

Answer 1

form-elements will not be submitted when they are disabled(amount1,totalamount and balance are disabled)

Use the readonly-attribute instead