function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Maneesh Gupta 11Maneesh Gupta 11 

Calculating field in VF Pageblock table

Hi Experts,
I have a simple requirement. Its for the computation of Simple Interest. My Custom object contains 3 fields - Principal_Amt__c, Years__c & Rate__c
I need to show these 3 fields in a page block table with an additional 4th field (Simple Interest) which will be calculated run time when the page is displayed.
I know there could be various ways to achive this (extension, Java Script function etc.) but I am curious to understand if I really need to write an extension/JS function to compute Simple Interest?
Can't we do this simple field calculation in the VF page itself?
Please advise
pconpcon
You should be able to do this calculation inside the controller and then display the value out to the Visualforce page.
Swayam@SalesforceGuySwayam@SalesforceGuy
Hey,,  If you don't want to Use Extension, you can use Javascript /Jquery function 

 
var $ = function (id) {
    return document.getElementById(id);
}


var calculate_click = function () {
    var investment = parseFloat( $("investment").value );
    var annualRate = parseFloat( $("rate").value );
    var years = parseInt( $("years").value );

	$("futureValue").value = "";
	
	if (isNaN(investment) || investment <= 0) {
		alert("Investment must be a valid number\nandgreater than zero.");
	} else if(isNaN(annualRate) || annualRate <= 0 || annualRate >=20) {
		alert("Annual rate must be a valid number greater than zero and less than 20.");
	} else if(isNaN(years) || years >= 50) {
		alert("Years must be a valid number\nless than 50.");
	} else {
		[color="#8B0000"]var monthlyRate = annualRate / 12 / 100;	[/color]	
                var months = years * 12;
		var futureValue = 0;
[color="#8B0000"]
		for ( i = 1; i <= months; i++ ) {
			futureValue = ( futureValue + investment ) *
				(1 + monthlyRate);[/color]
		}
		$("futureValue").value = futureValue.toFixed(2);

}

THE HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Future Value Calculator</title>
    <link rel="stylesheet" type="text/css" href="future_value.css" />
    <script type="text/javascript" src="future_value.js"></script>
</head>

<body>
    <div id="content">
        <h1>Future Value Calculator</h1>
        <p>Enter the values below and click "Calculate".</p>
        
        <label for="investment">One Time Investment:</label>
        <input type="text" id="investment" /><br />
        
        <label for="rate">Annual Interest Rate:</label>
        <input type="text" id="rate" />%<br />
        
        <label for="years">Number of Years:</label>
        <input type="text" id="years" /><br />
        
        <label for="futureValue">Future Value:</label>
        <input type="text" id="futureValue" disabled="disabled" /><br />
        
        <label>&nbsp;</label>
        <input type="button" id="calculate" value="Calculate" />&nbsp;<input type="button" id="clear" value="Clear" /><br />
        
               
    </div>
</body>
</html>



var clear_click = function () {
 $("investment").value = ""; 
 $("rate").value = "";
 $("years").value = "";
 $("futureValue").value = "";
 }
}


window.onload = function () {
    $("calculate").onclick = calculate_click;
	$("clear").onclick = clear_click;
    $("investment").focus();
}