Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Client-side Scripting _ Cumulative percentage increment calculation

Posted by: shankar from vizag Oct 21 2020, 11:17 AM

Greetings

I am trying to make a cumulative compound interest future value calculator using html and javascript. I am not able to get proper values. I am not understanding where I am going wrong.

1. Investment column leaving the initial row, 10% increment to show.
2. 12% return on 100 in 1st year should come 12 but its showing 24. Apart from the initial row, rest of all showing correct values.

Kindly guide me in fixing the issues.

Thank you
Shankar


Attached thumbnail(s)
Attached Image

Attached File(s)
Attached File  index.html ( 4.15k ) Number of downloads: 246

Posted by: CharlesEF Oct 22 2020, 08:15 PM

Your logic eludes me but I think 1 of your problems is: 'var duplicateprincipal = principal;'. I think you're assigning that value at the wrong place. I think it should be: 'var duplicateprincipal = 0;'. Now you need to move 'var duplicateprincipal = principal;' to the correct place.

Posted by: shankar from vizag Oct 27 2020, 11:24 AM

QUOTE(CharlesEF @ Oct 23 2020, 06:45 AM) *

Your logic eludes me but I think 1 of your problems is: 'var duplicateprincipal = principal;'. I think you're assigning that value at the wrong place. I think it should be: 'var duplicateprincipal = 0;'. Now you need to move 'var duplicateprincipal = principal;' to the correct place.


Thank you so much Charles. With your suggestions, I made it today and its working nice.

One more doubt is, the calculation is displaying in a tabular format in a new page. What to do to get the result in the same html input page ?

Please help me in this regard.

Thank you so much for your support.

S.B.Shankar

Posted by: CharlesEF Oct 27 2020, 02:43 PM

Are you asking how to show the tabular format data and keep the elements filled in by user showing at the top? If I understand correctly then you need to redesign the page to not use 'document.writeln' anywhere.

You should be building your tabular format data in javascript, like I showed you in this https://forums.htmlhelp.com/index.php?s=&showtopic=60103&view=findpost&p=138404.

Posted by: shankar from vizag Oct 30 2020, 10:03 AM

QUOTE(CharlesEF @ Oct 28 2020, 01:13 AM) *

Are you asking how to show the tabular format data and keep the elements filled in by user showing at the top? If I understand correctly then you need to redesign the page to not use 'document.writeln' anywhere.

You should be building your tabular format data in javascript, like I showed you in this https://forums.htmlhelp.com/index.php?s=&showtopic=60103&view=findpost&p=138404.


I thank you a lot Charles, with your valuable suggestion I completed the application successfully.

I need one more help from you. I want to display the result in a line or bar chart basing on age and end corpus column results. I request you to guide me in this regard please.

Thank you
S.B.Shankar
Attached File  nps.html ( 5.4k ) Number of downloads: 267

Posted by: CharlesEF Oct 30 2020, 01:51 PM

Well, I might not be able to help this time. I've never had the need to create any bar charts. I 'assume' you would start with a canvas and place your data in the canvas, to create the bar charts. Beyond that I would have to do research.

Do a web search, or find a chart library to use. If you don't really need a library and only need a 1 time solution then I might be able to help. But you need to ask specific questions.

Posted by: CharlesEF Oct 30 2020, 07:42 PM

After looking over your code I would make 2 suggestions.

1. Don't use a submit button. You don't even have a form. Use a normal button to trigger the onclick to launch 'createTable()'.
2. The table div can have a 'style="display: none"' attribute to hide the div/table. After all calculations are done, the last line of 'createTable()' should have code to show the div/table.

If you need to rerun the data then just reload the page to start over. I didn't review your math because you seem to be happy with it.

Posted by: shankar from vizag Nov 3 2020, 11:10 AM

QUOTE(CharlesEF @ Oct 31 2020, 06:12 AM) *

After looking over your code I would make 2 suggestions.

1. Don't use a submit button. You don't even have a form. Use a normal button to trigger the onclick to launch 'createTable()'.
2. The table div can have a 'style="display: none"' attribute to hide the div/table. After all calculations are done, the last line of 'createTable()' should have code to show the div/table.

If you need to rerun the data then just reload the page to start over. I didn't review your math because you seem to be happy with it.


Greetings Charles

With all your suggestions, I had changed the code and now its working fine.

I added one more column to my application namely year of inception. Basing on the user input, the rest of years should be displayed till the age of 60 (first column). Say for example , if the user enters 2004 as year of inception, the column should display 2004, 2005, 2006... so on

I believe the following lines of code will fulfil the need, but I am not understanding the placement of the code

for ( var invyear=year; invyear<=2030; invyear++ ){
cell7.innerHTML =invyear.toString().length < 4 ? "0" + invyear : invyear;
}

Please guide me in this regard.

Thank you
S.B.ShankarAttached File  nps.rar ( 20k ) Number of downloads: 246

Posted by: CharlesEF Nov 4 2020, 01:24 AM

I think you're looking at this the wrong way. I think all you need to do is assign a variable outside your main for loop. Then use that variable inside the for loop. At the end of the loop (before it starts the next loop) just increment the variable, like this.

CODE
var year = +document.getElementById("invyr").value;
for loop starts
  This is where all your code to fill in the table goes
  year++;
for loop ends

I downloaded your code but haven't looked at it yet.

Or have I misunderstood you?

Posted by: shankar from vizag Nov 4 2020, 10:37 AM

QUOTE(CharlesEF @ Nov 4 2020, 11:54 AM) *

I think you're looking at this the wrong way. I think all you need to do is assign a variable outside your main for loop. Then use that variable inside the for loop. At the end of the loop (before it starts the next loop) just increment the variable, like this.
CODE
var year = +document.getElementById("invyr").value;
for loop starts
  This is where all your code to fill in the table goes
  year++;
for loop ends

I downloaded your code but haven't looked at it yet.

Or have I misunderstood you?


Greetings Charles

With you suggestion I had declared a variable before starting the main for loop. After finishing the main For Loop, I had given the for loop but no result is displaying on the application.
Attached File  gnps.html ( 9.06k ) Number of downloads: 271
Attached Image

1. When the user enters the age input, table displays upto 60 years with the help of main FOR loop.
2. So, the input for "year of inception" should continue upto the maximum age i.e 60 (first column max. age) with an incremental phase.
3. The 4th cell value (Office Contribution) which is 10% should change to 14% from the "year of Inception" 2014 onwards.

The above three features I want to add to the application. Request to guide me. I tried in lot many times but not working.

Thank you
S.B.Shankar

Posted by: CharlesEF Nov 4 2020, 04:46 PM

Ok, I've looked over your code and found your problem. You didn't put any code in the for loop to display the year. Also, I see you still don't use a doctype. You should and I'm sure I've mentioned it before. And as far as I know a select element doesn't have a type attribute (you use select type="text"). Add these 2 lines to your code:

CODE
  cell7.innerHTML = year;
  year++;
} //END OF MAIN FOR LOOP

This code should be removed:
CODE
for ( var invyear=year; invyear<=2100; invyear++ ){                      
  cell7.innerHTML =invyear.toString().length < 4 ? "0" + invyear : invyear;
  year++;
}
This code makes no sense to me. And it's in the wrong place.

Posted by: CharlesEF Nov 4 2020, 07:34 PM

Let me ask you a question. The code I told you to remove, it didn't make sense to me. What was it intended to do? As written it results in the last table row/column containing the year 2100.

What do want to happen?

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)