Using Javascript to calculate monthly payments on form

Question

I have a single page form where I would like to be able to
allow the user to choose between making a one time payment or
monthly payments for a user defined amount. I could easily break
the form into two pages and calculate the value of the monthly
payments and display it on the second page if the user selected the
monthly payment option. What I would like is a single page where
the monthly payment is determined on the fly when either the user
selects the monthly payment radio button or when the user defined
dollar amount is entered.
I think I have the function determined to do the calculation
for the monthly payment but I'm unsure as to how to get cf to read
or display the value. I was trying to use the following with no
luck:
<input type=radio name=Installments value="Yes" tabindex=1
onClick="calculatemonthlypayment(document.forms[0].DonationAmount)">
<script type="text/javascript">
function calculatemonthlypayment(donation)
monthlypayment=(donation/12)
return monthlypayment
</script>
Then trying to output the result like this:
<cfoutput><input type="text" readonly="yes"
value="#dollarformat(monthlypayment)#"></cfoutput>
Any idea what I'm doing wrong or missing? Or is there a much
better way to accomplish this?

Answer 1

> <cfoutput><input type="text" readonly="yes"
value="#dollarformat(monthlypayment)#"></cfoutput>
You cannot do that. CF code is executed on the server
(first). The resulting javascript (html, css, ...) code is then
sent to the browser where it is executed. Since javascript code is
executed in the client browser,
after the CF code is already finished, the variable
"monthlypayment" doesn't exist as far as CF is concerned.
You can use javascript to both read the donation text field
amount and calculate the "monthlypayment" amount to display. Here
is a simple example. You'll need to add validation and number
formatting.