How to Code a Loan (Payment) Estimator in HTML? - html

I am setting up a new website through godaddy.com and am having the hardest time trying to code up the calculator for customers to estimate their payments (Must Include: Loan Amount, Loan Length in Months, Interest rate, and Monthly Payment). The Monthly payment is what I am having trouble calculating because of code placement. Again, i am working with godaddy.com and just need an HTML code for this payment estimator.
I have tried inspecting multiple pages to see what I can get off of them, I have used an html generator, and have contacted several people in my are with no hope.
This is the code I currently have:
<html><div class="wpb_wrapper"><center><form method="POST" name="calc">
<table border="0" width="60%">
<tbody>
<tr>
<th bgcolor="#FFFFFF" width="50%">Data Entry</th>
</tr>
<tr>
<td bgcolor="#F7F7F7">Loan Amount</td>
<td align="right" bgcolor="#F7F7F7">$<input id="amount" max="100000000" min="1" name="loan" size="10" type="text" /></td>
</tr>
<tr>
<td bgcolor="#F7F7F7">Loan Length in Months</td>
<td align="right" bgcolor="#F7F7F7"><input name=" months" size="10" type="text" /></td>
</tr>
<tr>
<td bgcolor="#F7F7F7">Interest Rate</td>
<td align="right" bgcolor="#F7F7F7">%<input max="10000000" min="1" name="rate" size="10" type="text" value="10" /></td>
</tr>
<tr>
<td bgcolor="#F7F7F7">Monthly Payment</td>
<td align="right" bgcolor="#F7F7F7"><em>Calculated</em> <input name="pay" size="10" type="text" /></td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF"><input type="reset" value="Reset" /></td>
<td align="center" bgcolor="#FFFFFF"><input type="button" value="Calculate" /></td>
</tr>
</tbody>
</table>
</form>
<p><span style="font-size: xx-small;"> "Enter only numeric values (no commas), using decimal points where needed." <br /> "Non-numeric values will cause errors." </span></p>
</center></div></html>
No error messages, it just won't let me calculate the monthly payment.

What you have is a pure HTML code, which cannot do any calculation by itself.
However, if all you want is a simple loan calculator, you don't have to code one from scratch. There are free ready-to-use calculators available that can be embedded in to your HTML code.
Solution 1: Using an HTML embed code.
Here's one such free calculator I found from https://www.mortgagecalculator.biz/c/free3.php :
Paste this in your html code:
<div style="width:185px; text-align:center;">
<p style="text-align:center;">
<a href="https://www.mortgagecalculator.biz" target="_blank">
<img src="https://www.mortgagecalculator.biz/img/mlogo.gif" border="0" alt="Mortgage Calculator.biz."/>
</a><br/>
<iframe src="https://www.mortgagecalculator.biz/c/variables.php?loan=258678&rate=4.1&years=30" frameborder="0" width="185px" height="240px" scrolling="no"></iframe><br/>
<font size="1" color="#000000">HTML Mortgage Calculators</font>
</p>
</div>
The downside of using an embed code is it relies on an external site for the calculator. If that site goes down, so does your calculator.
Solution 2: Integrating code in the html file:
The better alternative is to integrate the actual calculator code on your HTML file. Try looking for a free code online, that can be used with the author's permission.
Here is something for your reference: http://www.javascriptkit.com/script/cut155.shtml
PS: Posting this as an answer since my current reputation (11) doesn't let me comment.

HTML alone can't do calculations. To do this, you will need to learn javascript (there are many good tutorials on the web).
After you learn javascript, and you know how to create functions and change the content of elements, you can do these calculations.
To run a javascript function when a button is clicked, write this:
<button onclick="function();">Button text</button>

Related

Set HTML label to WebService invocation's result

Rather new to webservices when it comes to implementing them in HTML. I've been doing research on this for, no joke, an entire month, and still found nothing. Here's the code - The idea is it's just a simple email sender from a fixed email address, and the webservice is called directly from the form.
<body>
<form id="mainForm" method="post" action="http://habakkuk/api/emailHandler.asmx/SendEmailMain"">
<table>
<tr>
<td class="textcolumn">
To:
</td>
<td>
<input type="text" size="50" name="m_To"/>
</td>
</tr>
<tr>
<td class="textcolumn">
Subject:
</td>
<td>
<input type="text" size="50" name="m_Subject"/>
</td>
</tr>
<tr>
<td class="messageText">
Message:
</td>
<td class="messageBox">
<textarea name="m_Body" cols="50" rows="10"></textarea>
</td>
</tr>
<tr>
<td class="textcolumn"></td>
<td>
<input type=submit value="Send Message">
</td>
</tr>
</table>
</form>
<p>
</p>
</body>
Thing is, even this bit took me a week's worth of searching, to add to the ridiculousness. Now my issue is getting the webservice result to set the text of a label or something somehow. Preferably, I'd want an alert, though as far as I am aware, that's a javascript bit and I'm not sure how to go about that either.
Any pointers, assistance, or references to an already answered question I may have missed will be of major help.

is there a way to save html form data with out web server or use of php?

This is an example of the code i have. there are multiple data fields that need saved and n seperate lines so the data is legible.
enter code here
<html>
<body>
<center>
<font size="2" face="arial" color="#CF18DC">
* Required Field</font></center>
<center><form enctype="multipart/form-data" method="post" action="" accept- charset="UTF-8">
<tr>
<td valign="top">
<center><strong><font color="#CF18DC">* </font>/Member #: </strong>
</td>
<td valign="top">
<input type="text" name="field-885d025b2e34341" id="field-885d025b2e34341" size="40" value="" />
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value=" Submit Form " />
</td>
</table>
</form>
</body>
</html>
i need a submit function or something to save the form data to a txt file in a local directory. I just cant figure this out can anyone please help? The file name that saves has to be the answer received in one of the collected data fields or it will just over write the file each time. Is this possible?
Not really. You will need some sort of contraption on the server side in order to write data to a source.
it does not have to be PHP. It can be any number of things; PHP, Python, Node.js, Ruby, etc.
You should easily be able to do this with some Javascript/Jquery. I'm not 100% sure this is what you're looking for, but I'm going on a hunch.
See htmlNewbie's question.
Hope this helps.

<textarea> causing 404 error on particular inputs

I've come across a weird problem. I have a simple form which submits data to a php processor page. However, the following input to the description field causes a 404 Error.
To recognize and reward the best in
Indian theatre, The Mahindra and
Mahindra presents META (Mahindra
Excellence in Theatre Awards). The
only award of its kind, META is
designed to showcase the best in
theatre being produced in India. An
eminent selection committee shortlists
the 10 best plays from innumerable
entries from all across India. These
plays are staged and adjudged under 13
award categories. The festival
culminates with an scintillating
awards ceremnony. Entering its sixth
year, META’s objective remains to
encourage all aspects of theatre craft
such as playwriting, set, costume and
light design, direction and
performance and promoting theatre.
I've tried changing the apostrophes and commas, even the brackets, but it didn't help.
The code for the form:
<form class="cms" action="add.php" enctype="multipart/form-data" method="post">
<table>
<tr>
<td class="text">
Title
</td>
<td class="input">
<input type="text" size="20" name="title" value="" />
</td>
</tr>
<tr>
<td class="text">
Date
</td>
<td class="input">
<input type="text" size="20" name="date" value="" />
</td>
</tr>
<tr>
<td class="text">
Image
</td>
<td class="input">
<input type="file" name="image" />
</td>
</tr>
<tr>
<td class="text">
Description
</td>
<td class="input">
<textarea name="description" rows="5" cols="20"></textarea>
</td>
</tr>
<tr>
<td class="text">
Link
</td>
<td class="input">
<input type="text" size="20" name="link" value="" />
</td>
</tr>
<tr>
<td class="text">
<input type="submit" value="Add / Save" />
</td>
<td>
<input type="reset" value="Clear" />
</td class="input">
</tr>
</table>
</form>
On submitting the text above i get the following error :
Not Found The requested URL
/cms/events/add.php was not found on
this server.
Apache/1.3.41 Server at
www.xyzs.in Port 80
Is this a problem with the text-encoding?
Could the add.php page contain an execute, maybe for an error page if the input is to long and the 404 is because the error page is not there?
I have seen similar errors in ASP where execute "" was used to load another page and if that page was not found you got an error, but exactly which error can differ from server implementation.
Also, does this work with other input with shorter or same length?
For someone else with Similar Issue:
Your text contains sensitive keywords which cause 404. Last night I got similar issue with text area, After deep analyzing I found that my text contains a keyword "Select", When I remove it submits successfully. In your case keyword "META" might causing this error.
What you have to do is white list these sensitive keywords from your server by contacting your server administrator.

How does the input tags really work?

I read several articles, but couldn't really get things working. Here's what I'm talking about. The Html of a webpage:
<form id="LOGINFORM" name="LOGINFORM" style="margin:0px; padding:0px;" action="login.php" method="post">
<table cellspacing="2" cellpadding="0" border="0" width="100%">
<tr>
<td width="100" align="center" valign="bottom">
Username:
</td>
<td width="100" align="center" valign="bottom">
Pass:
</td>
<td valign="top" align="right">
</td>
</tr>
<tr>
<td align="center">
<input class="inputbox" style="text-align:center; width:90px;" maxlength="12" name="loginname" type="text" size="12">
</td>
<td align="center">
<input class="inputbox" style="text-align:center; width:90px;" maxlength="12" name="password" type="password" size="12">
</td>
<td align="left">
<input
class="button_ok"
name="btnSubmit"
id="btnSubmit"
type="submit"
value="Вход"
onclick=""
>
</td>
</tr>
</table>
</form>
say the webpage is helloworld.com, account is foo, pass is bar.
What I browse: helloworld.com/login.php?loginname=foo&password=bar
But server returns that username/password is wrong, but they aren't. What do I do wrong?
The logic in login.php says that loginname=foo&password=bar is wrong. That is where you need to look to find out why it doesn't work.
As for what is wrong with the HTML.
You are using a table for layout
You aren't using <label> elements to label your inputs
You having given a form a name, these days an id is all that is required (and then only if you need to reference it with JS or CSS)
You are using a style attribute instead of a seperate stylesheet, and quite a few obsolete presentational attributes (such as align, width and cellspacing)
that form secifies that the data is passed via POSt, and not GET as you are trying to pass it. If a form wants data back specifically as POST data, that page will ignore GET data. see this tutorial
Your HTML says method="post", so I guess the server will only accept those values by the POST method. When you browse that URL, you are sending them using the GET method.
You are confusing GET and POST in PHP:
$_GET['loginname'] will retrieve a query string variable.
$_POST['loginname'] will retrieve the value of the input named "loginname". (This is what you need.)
helloworld.com/login.php?loginname=foo&password=bar uses GET

how to access form array fields with struts2

Currently I am working on one form which contains 2 buttons. Clicking on 1 button I am getting block of html fields as below.
`
<table width="100%">
<tbody><tr>
<td class="style4" width="12%" align="center">CODE<span class="style3"> </span></td>
<td width="18%"><input name="c_code[]" value="" id="c_code__" class="box_border" style="width: 120px;" type="text"></td>
<td class="style3" width="15%" align="right">Price</td>
<td width="7%"><input name="c_price[]" value="" id="c_price__" class="box_border" style="width: 40px;" type="text"></td>
<td class="style3" width="4%" align="right">Qty</td>
<td width="7%"><input name="c_qty[]" value="" id="c_qty__" class="box_border" style="width: 40px;" type="text"></td>
<td class="style3" width="9%" align="right">On Sale </td>
<td width="3%"><input name="c_onsale[]" id="c_onsale__" value="" type="radio">
<label for="c_onsale"></label>
</td>
<td class="style3" width="10%" align="center">Exposition</td>
<td width="15%"><input name="c_exposition[]" size="15" value="" id="c_exposition__" class="box_border" type="text"></td>
</tr>
</tbody></table>
`
Now each time user clicks on button whole block given above will be included in html form using ajax method call.
Now my problem is how can I get values of all elements as an array in struts2 action class.
Or How to write setter and getter method for these arrays.
Is there any better way to perform above in other way which make work easier for me?
How to write struts2 validation file for array fields like this?
Can anyone help me in this matter.
Thanks.
Ok, if you can rename your fields using an index in the array for each iteration, so they'll be named c_name[0], c_name[1], etc... Then you can just define an array in your action class and the mapping will be done without problems.
As for validation I would suggest a server-side validation on your action.
Regards,
Use List instead of an array on the server side and struts will automatically map the new sections(new block of element on UI) to it.
If you define it as an array then it will not be able to initialize new section each time as the size cannot increase dynamically