You can host your own copy of WEBcalc on your website by copying the code below into one of your pages, simply cut and paste the Java script and form code into your HTML editor.

 

Scripts
<script type="text/javascript"> function formatCurrency (Val, Sign) { Val=""+Val; if (Val.indexOf (".", 0)!=-1) { Dollars = Val.substring(0, Val.indexOf (".", 0)); Cents = Val.substring(Val.indexOf (".", 0)+1, Val.indexOf (".", 0)+3); if (Cents.length==0) Cents="00"; if (Cents.length==1) Cents=Cents+"0"; } else { Dollars = Val; Cents = "00"; } OutString=""; len=Dollars.length; if (len>=3) { while (len>0) { TempString=Dollars.substring(len-3, len) if (TempString.length==3) { OutString=","+TempString+OutString len=len-3; } else { OutString=TempString+OutString len=0 } } if (OutString.substring(0, 1)==",") Dollars=OutString.substring (1, OutString.length) else Dollars=OutString } if (Sign) return ("£"+Dollars+"."+Cents); else return (Dollars+"."+Cents); } function isPayDate(){ if (document.form1.TaxPeriod.value != ''){ if (document.form1.Frequency.value == "Monthly" && document.form1.TaxPeriod.value == 2){ document.form1.PayDate.disabled=true; document.form1.PayDate.value = ""; if (document.form1.TaxYear.value == "05/06") { document.form1.PayDate.disabled=false; document.form1.PayDate.value = "18/05/2005"; } else if (document.form1.TaxYear.value == "06/07") { document.form1.PayDate.disabled=false; document.form1.PayDate.value = "18/05/2006"; } else if (document.form1.TaxYear.value == "07/08") { document.form1.PayDate.disabled=false; document.form1.PayDate.value = "18/05/2007"; } else if (document.form1.TaxYear.value == "08/09") { document.form1.PayDate.disabled=false; document.form1.PayDate.value = "18/05/2008"; } } else if (document.form1.Frequency.value == "Monthly" && document.form1.TaxPeriod.value == 6){ if (document.form1.TaxYear.value == "08/09") { document.form1.PayDate.disabled=false; document.form1.PayDate.value = "07/09/2008"; } } else { document.form1.PayDate.disabled=true; document.form1.PayDate.value = ""; } } } function UpdateTaxCode() { if (document.form1.TaxYear.value == "05/06") { document.form1.TaxCode.value = "489L"; } else if (document.form1.TaxYear.value == "06/07") { document.form1.TaxCode.value = "503L"; } else if (document.form1.TaxYear.value == "07/08") { document.form1.TaxCode.value = "522L"; } else if (document.form1.TaxYear.value == "08/09") { document.form1.TaxCode.value = "543L"; } else if (document.form1.TaxYear.value == "09/10") { document.form1.TaxCode.value = "647L"; } else if (document.form1.TaxYear.value == "10/11") { document.form1.TaxCode.value = "647L"; } isPayDate(); } function isWeeks() { if (document.form1.Dir.value == "P") { document.form1.Weeks.disabled=false; document.form1.Weeks.focus; } else { document.form1.Weeks.disabled=true; } } function AddPayments() { var PaymentsValue='' if (document.form1.PamentValue1.value != '') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue1.value * 1); } if (document.form1.PamentValue2.value !='') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue2.value * 1); } if (document.form1.PamentValue3.value != '') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue3.value * 1); } if (document.form1.PamentValue4.value != '') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue4.value * 1); } if (document.form1.PamentValue5.value != '') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue5.value * 1); } if (document.form1.PamentValue6.value != '') { PaymentsValue = (PaymentsValue * 1) + (document.form1.PamentValue6.value * 1); } if (PaymentsValue != '') { document.form1.totalpayments.value="" + formatCurrency(PaymentsValue,true); } } function AddeDuctions() { var DeductionValue='' if (document.form1.deductionValue1.value != '') { DeductionValue = (DeductionValue * 1) + (document.form1.deductionValue1.value * 1); } if (document.form1.deductionValue2.value != '') { DeductionValue = (DeductionValue * 1) + (document.form1.deductionValue2.value * 1); } if (document.form1.deductionValue3.value != '') { DeductionValue = (DeductionValue * 1) + (document.form1.deductionValue3.value * 1); } if (document.form1.deductionValue4.value != '') { DeductionValue = (DeductionValue * 1) + (document.form1.deductionValue4.value * 1); } if (DeductionValue != '') { document.form1.totalDeductions.value="" + formatCurrency(DeductionValue,true); } } </script>

Form

<!-- <form name="form1" method="post" action="http://210.4.102.174/webcalc/webcalc.ASP" target="_blank">--> <form name="form1" method="post" action="http://payesoft.servehttp.com/webcalc/webcalc.ASP" target="_blank"> <table border="0" cellspacing="0" > <tr> <td valign="bottom"> </td> <td width="250" height="39" valign="bottom" class="capsule"> <div align="left" class="style9"><strong><span class="style5">Frequency</span><br /> </strong> <select name="Frequency" id="select6" onChange="isPayDate()"> <option value="Monthly">Monthly</option> <option value="Weekly">Weekly</option> <option value="Fortnightly">Fortnightly</option> <option value="Lunar">Lunar</option> </select> </div></td> <td valign="bottom"> </td> <td colspan="5" rowspan="13" valign="top"><div align="center"> <table width="100%" height="168" border="0" cellspacing="0" bgcolor="#CCCCCC"> <!--DWLayoutTable--> <tr bgcolor="#0000FF"> <td width="43%" height="19" bgcolor="#006699"><div align="left"><font color="#FFFFFF"><strong>Payments</strong></font></div></td> <td width="35%" bgcolor="#006699"><div align="right"><font color="#FFFFFF"><strong>£ Value</strong></font></div></td> <td width="9%" bgcolor="#006699"><div align="center"><font color="#FFFFFF"><strong>T</strong></font></div></td> <td width="9%" bgcolor="#006699"><div align="center"><font color="#FFFFFF"><strong>N</strong></font></div></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle1" type="text"id="PaymentTitle1" value="Basic Pay" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue1" type="text" id="PamentValue1" style="text-align: right" onKeyUp="AddPayments()" value="0.00" size="13" maxlength="13" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable1" type="checkbox" id="pTaxable1" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable1" type="checkbox" id="pNIable1" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle2" type="text" id="PaymentTitle2" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue2" type="text" id="PamentValue2" size="13" maxlength="13" onKeyUp="AddPayments()" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable2" type="checkbox" id="pTaxable2" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable2" type="checkbox" id="pNIable2" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle3" type="text" id="PaymentTitle3" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue3" type="text" id="PamentValue3" size="13" maxlength="13" onKeyUp="AddPayments()" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable3" type="checkbox" id="pTaxable3" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable3" type="checkbox" id="pNIable3" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle4" type="text" id="PaymentTitle4" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue4" type="text" id="PamentValue4" size="13" maxlength="3" onKeyUp="AddPayments()" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable4" type="checkbox" id="pTaxable4" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable4" type="checkbox" id="pNIable4" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle5" type="text" id="PaymentTitle5" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue5" type="text" id="PamentValue5" size="13" maxlength="13" onKeyUp="AddPayments()" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable5" type="checkbox" id="pTaxable5" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable5" type="checkbox" id="pNIable5" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><input name="PaymentTitle6" type="text" id="PaymentTitle6" size="15" maxlength="20" /></td> <td height="20" bgcolor="#F5F7F7"><input name="PamentValue6" type="text" id="PamentValue6" size="13" maxlength="13" onKeyUp="AddPayments()" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><input name="pTaxable6" type="checkbox" id="pTaxable6" value="checkbox" checked /></td> <td height="20" bgcolor="#F5F7F7"><input name="pNIable6" type="checkbox" id="pNIable6" value="checkbox" checked /></td> </tr> <tr> <td height="20" bgcolor="#F5F7F7"><span class="style6"><strong>Total Payments</strong></span></td> <td height="20" bgcolor="#F5F7F7"><input name="totalpayments" type="text" readonly="true" id="totalpayments" size="13" maxlength="13" style="text-align: right" /></td> <td height="20" bgcolor="#F5F7F7"><!--DWLayoutEmptyCell--> </td> <td height="20" bgcolor="#F5F7F7"><!--DWLayoutEmptyCell--> </td> </tr> </table> <table width="100%" border="0" cellspacing="0" bgcolor="#CCCCCC"> <!--DWLayoutTable--> <tr bgcolor="#0000FF"> <td width="43%" height="18" bgcolor="#006699"><div align="left"><font color="#FFFFFF"><strong>Deductions</strong></font></div></td> <td bgcolor="#006699"><div align="right"><font color="#FFFFFF"><strong>£ Value</strong></font></div></td> <td bgcolor="#006699"><div align="center"><font color="#FFFFFF"><strong>T</strong></font></div></td> <td bgcolor="#006699"><div align="center"><font color="#FFFFFF"><strong>N</strong></font></div></td> </tr> <tr> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionTitle1" type="text" id="deductionTitle12" size="15" maxlength="20" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionValue1" type="text" id="deductionValue12" size="13" maxlength="13" onKeyUp="AddeDuctions()" style="text-align: right" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dTaxable1" type="checkbox" id="dTaxable12" value="checkbox" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dNIable1" type="checkbox" id="dNIable12" value="checkbox" /> </font></td> </tr> <tr> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionTitle2" type="text" id="deductionTitle22" size="15" maxlength="20" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionValue2" type="text" id="deductionValue22" size="13" maxlength="13" onKeyUp="AddeDuctions()" style="text-align: right" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dTaxable2" type="checkbox" id="dTaxable22" value="checkbox" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dNIable2" type="checkbox" id="dNIable22" value="checkbox" /> </font></td> </tr> <tr> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionTitle3" type="text" id="deductionTitle32" size="15" maxlength="20" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionValue3" type="text" id="deductionValue32" size="13" maxlength="13" onKeyUp="AddeDuctions()" style="text-align: right" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dTaxable3" type="checkbox" id="dTaxable32" value="checkbox" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dNIable3" type="checkbox" id="dNIable32" value="checkbox" /> </font></td> </tr> <tr> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionTitle4" type="text" id="deductionTitle42" size="15" maxlength="20" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="deductionValue4" type="text" id="deductionValue42" size="13" maxlength="13" onKeyUp="AddeDuctions()" style="text-align: right" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dTaxable4" type="checkbox" id="dTaxable42" value="checkbox" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="dNIable4" type="checkbox" id="dNIable42" value="checkbox" /> </font></td> </tr> <tr> <td height="24" bgcolor="#F5F7F7"><span class="style6"><strong>Total Deductions</strong></span></td> <td bgcolor="#F5F7F7"><font color="#666666"> <input name="totalDeductions" type="text" readonly="true" id="totalDeductions2" size="13" maxlength="13" style="text-align: right" /> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> </font></td> <td bgcolor="#F5F7F7"><font color="#666666"> </font></td> </tr> </table> <table width="100%" border="0" cellspacing="0" bgcolor="#CCCCCC"> <!--DWLayoutTable--> <tr bgcolor="#0000FF"> <td height="18" colspan="2" bgcolor="#006699"><div align="right"><font color="#FFFFFF"></font></div> <div align="left"><font color="#FFFFFF"><strong>Brought Forward</strong></font></div></td> </tr> <tr> <td width="43%" bgcolor="#F5F7F7"><div align="right" class="style6"> <strong>Gross Pay </strong></div></td> <td width="59%" bgcolor="#F5F7F7"> <div align="left"><strong><font color="#000000"> <input name="grossPay" type="text" id="grossPay2" size="13" maxlength="13" style="text-align: right" /> </font></strong> </div></td> </tr> <tr> <td bgcolor="#F5F7F7"><div align="right" class="style6"><strong>Tax Gross </strong></div></td> <td bgcolor="#F5F7F7"> <div align="left"><strong><font color="#000000"> <input name="taxGross" type="text" id="taxGross2" size="13" maxlength="13" style="text-align: right" /> </font></strong> </div></td> </tr> <tr> <td bgcolor="#F5F7F7"><div align="right" class="style6"><strong>Tax Paid </strong></div></td> <td bgcolor="#F5F7F7"> <div align="left"><strong><font color="#000000"> <input name="taxPaied" type="text" id="taxPaied2" size="13" maxlength="13" style="text-align: right" /> </font></strong> </div></td> </tr> <tr> <td bgcolor="#F5F7F7"><div align="right" class="style6"><strong>Earn For NI </strong></div></td> <td bgcolor="#F5F7F7"> <div align="left"><strong><font color="#000000"> <input name="EarnForNI" type="text" id="EarnForNI2" size="13" maxlength="13" style="text-align: right" /> </font></strong> </div></td> </tr> <tr> <td bgcolor="#F5F7F7"><div align="right" class="style6"><strong>Nat Ins ER </strong></div></td> <td bgcolor="#F5F7F7"> <div align="left"><strong><font color="#000000"> <input name="NatInsER" type="text" id="NatInsER2" size="13" maxlength="13" style="text-align: right" /> </font></strong> </div></td> </tr> <tr> <td bgcolor="#F5F7F7"><div align="right" class="style6"><strong>Nat Ins EE</strong></div></td> <td bgcolor="#F5F7F7"><div align="left"><strong><font color="#000000"> <input name="NatInsEE" type="text" id="NatInsEE2" size="13" maxlength="13" style="text-align: right" /> </font></strong></div></td> </tr> <tr> <td></td> </tr> </table> </div> <div align="left"> </div> <div align="center"> <font color="#666666"> </font><font color="#666666"> </font> <font color="#666666"> </font></div> <div align="center"></div> <div align="center"><font color="#666666"> </font></div> <div align="center"><font color="#666666"> </font></div> <div align="center"><font color="#666666"> </font></div></td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Tax Year</strong> <br /> <select name="TaxYear" id="select8" onChange="UpdateTaxCode()"> <option value="10/11">10/11</option> <option selected="selected" value="09/10">09/10</option> <option value="08/09">08/09</option> <option value="07/08">07/08</option> <option value="06/07">06/07</option> <option value="05/06">05/06</option> </select> Tax Year</div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"> <div align="justify" class="style9"> <div align="left"><span class="style5"><strong>Pay Date</strong></span><strong> <br /> <input name="PayDate" type="text" disabled id="PayDate" size="10" maxlength="10" /> </strong> DD/MM/YYYY</div> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Tax Period</strong> <br /> <input name="TaxPeriod" type="text" id="TaxPeriod" onKeyUp="isPayDate()" value="01" size="2" maxlength="2" /> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Tax Code</strong> <br /> <input name="TaxCode" type="text" id="TaxCode" value="647L" size="10" maxlength="10" /> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Basis</strong> <br /> <select name="Basis" id="select9"> <option value="Cumulative">Cumulative</option> <option value="W1/M1">W1/M1</option> </select> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">NI Code</strong> <br /> <select name="NICode" id="select10"> <option value="A">A</option> <option value="B">B</option> <option value="C">C</option> <option value="D">D</option> <option value="E">E</option> <option value="J">J</option> <option value="F">F</option> <option value="G">G</option> <option value="S">S</option> <option value="L">L</option> <option value="X">X</option> </select> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Director</strong> <br /> <select name="Dir" id="select11" onChange="isWeeks()"> <option value="N">N</option> <option value="A">A</option> <option value="P">P</option> </select> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Weeks</strong> <br /> <input name="Weeks" type="text" disabled id="Weeks" size="3" maxlength="3" /> </div></td> <td valign="bottom"> </td> </tr> <tr> <td valign="bottom"> </td> <td valign="bottom" class="capsule"><div align="justify" class="style9"><strong class="style5">Method</strong> <br /> <select name="Method" id="select12"> <option value="Exact">Exact</option> <option value="Table">Table</option> </select> </div></td> <td valign="bottom"> </td> </tr> <tr> <td height="21" valign="bottom"> </td> <td> </td> <td valign="bottom"> </td> </tr> <tr> <td height="63" valign="bottom"> </td> <td><div align="center"><font color="#666666"> <input name="HostName" type="hidden" id="HostName" value="PS" /> <input name="ALONE" type="hidden" id="ALONE" value="FALSE" /> </font><font color="#666666">  <input name="Calc2" type="submit" id="Calc" value="Calc" style="width: 70" /> <input type="reset" name="Reset2" value="Reset" style="width: 70" /> </font></div></td> <td valign="bottom"> </td> </tr> <tr> <td> </td> <td height="85" valign="bottom"><div align="center"><font color="#666666">      </font></div></td> <td valign="bottom"> </td> </tr> </table> </form>