Help with creating a mortgage calculator in Jquery

bigMAC28 · Apr 18, 2013

Hi guys, its currently 3am and I am stumped. I have to create a loan calculator for class and Im stuck on the most silly part. The Algorithm. The current algorithim i have is

;

Code:

payment = amt*((int*(int+1)^24)/(1+int)^24)-1;

I know the problem is with the Powers but i dont really know how to do it in jQuery. Any help would be greatly appreciated! Thanks.

-Mike

SrWebDeveloper · Apr 18, 2013

jQuery is used to get values from form fields or the document in the DOM.
You use normal Javascript for most basic math functions.

For jQuery help on selectors (need to know your CSS first):
http://api.jquery.com/category/selectors/

To get field values to plug into your formula use $('selector').val:

Code:

$('#element_name').val();

or to convert it to an Integer:

Code:

var myvalue = parseInt($('#element_name').val());

Below is a quick example of how to call jQuery and how functions are loaded and nested and a simple math statement just to show you a high elevation view of syntax:

Code:

<script type="text/javascript">
<!--//

$(function(){

var myvalue1 = parseInt($('#element_name1').val());
var myvalue2 = parseInt($('#element_name2').val());

function calcPrice(){

var rate = 1.5;
var final_value = rate * myvalue1 * myvalue2;

}
calcPrice();
}

});

//-->
</script>

Once you get the concepts of how values are called and pieced together in a jQuery function, the math actually is the easy part. I am not helping you with how to calculate a mortgage - but how to do a math operation based on form or document values using jQuery.

Before responding back (post your relevant code if so) do this first:

1) Add in print values for each value used in your formula and ensure they're set to what they should be
2) Use a browser inspection tool and check console log for JS errors to see if something obviously broken or syntax issue (i.e. chrome, or Firebug in FF)

bigMAC28 · Apr 18, 2013

Heres what I have. I think its all correct except for the formula. This is the way the instructor wants me to do it so using other functions are out. Thanks!

Code:

<html>
    <head>
        <script src="js/jquery.js"></script>
    </head>
	<body>
       
        <H1>Mortgage Calculator</H1>
      
             <Table>
                
                
                <TR><TD>Start Date</TD><TD><input id="a"></TD></TR>
                <TR><TD>Loan Amount</TD><TD><input id="b"></TD></TR>
                <TR><TD>Interest Rate</TD><TD><input id="c"></TD></TR>
                <TR><TD>Term (Years)</TD><TD><input id="d"></TD></TR>
                <TR><TD>Monthly Payment</TD><TD><input id="e"></TD></TR>
        	</Table>
                    <script>
                        <!--Gets value of a, stores it into x. Then takes X and gives it to the value of B-->
                        function copy_content() { x = jQuery('#a').val(); jQuery('#b').val(x);}
       
                  			
                  			
   
                       <!-- computes interest rate value-->
                           function computeInterestRate() { 
                           
                           	amt = jQuery('#b').val();
                            rate = jQuery('#c').val();
                			term = jQuery('#d').val();
                            months = (term*12);
                            w = final_compute(months,rate,amt);
                            jQuery('#e').val(w);
                           }
                      
                        jQuery('#d').keyup(computeInterestRate);
                        
                        /*    
                        function getTerm(){
                           term = jQuery('#d').val();
                           months = term*(12);
                          jQuery('#d').val(months);
                          }
                  	jQuery('#d').keyup(getTerm);
                     
*/
                        
                    
                        
                        function final_compute(months,int,amt){
                        
                            payment = amt*((int*(int+1)^24)/(1+int)^24)-1;
                        
                        return payment;
                        }
 
					</script>
    </body>
    </html>

SrWebDeveloper said:
jQuery is used to get values from form fields or the document in the DOM.
You use normal Javascript for most basic math functions.

For jQuery help on selectors (need to know your CSS first):
http://api.jquery.com/category/selectors/

To get field values to plug into your formula use $('selector').val:

Code:

$('#element_name').val();

or to convert it to an Integer:

Code:

var myvalue = parseInt($('#element_name').val());

Below is a quick example of how to call jQuery and how functions are loaded and nested and a simple math statement just to show you a high elevation view of syntax:

Code:

<script type="text/javascript">  </script>

Once you get the concepts of how values are called and pieced together in a jQuery function, the math actually is the easy part. I am not helping you with how to calculate a mortgage - but how to do a math operation based on form or document values using jQuery.

Before responding back (post your relevant code if so) do this first:

1) Add in print values for each value used in your formula and ensure they're set to what they should be
2) Use a browser inspection tool and check console log for JS errors to see if something obviously broken or syntax issue (i.e. chrome, or Firebug in FF)

SrWebDeveloper · Apr 18, 2013

A little sloppy not using var to declare variables when first used and you could have applied parseInt() like I did instead of casting as you did, but overall seems okay to me in terms of syntax. So does it work or not?

If not, I already addressed what to do in my previous reply at the bottom.

If so, congratulations.

bigMAC28 · Apr 18, 2013

Yeah I got it.

SrWebDeveloper said:
A little sloppy not using var to declare variables when first used and you could have applied parseInt() like I did instead of casting as you did, but overall seems okay to me in terms of syntax. So does it work or not?

If not, I already addressed what to do in my previous reply at the bottom.

If so, congratulations.

SrWebDeveloper · Apr 19, 2013

Well done for your class project.

Now for some informal advice for doing something like this in the real world, when clients are paying for it (this is not just for you, but anyone following as this is a teaching forum):

Move your custom JS to an external script document and reference it from within head, much like you did for jQuery library. In modern web development its wise to separate content from style from client side scripting. This centralizes the jQuery code and makes for much easier debugging and troubleshooting, plus a well organized site. Avoid embedding (script tags and code not in header) and inline (when JS or CSS is hard coded within attributes of HTML tags) unless necessary. Declare all JS variables upon first reference, add comments to explain your code and functions, and use sensible ID's and class names in your HTML so others can figure it out. Clean code is good code. Good code is good money, plus pride in doing it right. And if you come back a year later to debug an issue or add a new feature, etc., you'll spend less time re-learning your own code.

Search

Search

Help with creating a mortgage calculator in Jquery

bigMAC28

macrumors member

SrWebDeveloper

macrumors 68000

bigMAC28

macrumors member

SrWebDeveloper

macrumors 68000

bigMAC28

macrumors member

SrWebDeveloper

macrumors 68000

Our Staff