3 Replies - 1012 Views - Last Post: 31 August 2011 - 10:13 PM

#1 B2SALONWEBDESIGN  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 26-January 11

event handler named clear_click that clears text boxes

Posted 31 August 2011 - 07:40 AM

pls help. i am having a dickens of a time figuring out how to add an event handler that clears my text fields when the clear button is clicked.

this is the code that ive done but to no avail... thanks pls advise

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\nand greater than zero.");
	} else if(isNaN(annualRate) || annualRate > 20) {
		alert("Annual rate must be a valid number\nand less than or equal to 20.");
	} else if(isNaN(years) || years > 50) {
		alert("Years must be a valid number\nand less than or equal to 50.");
	} else {
		var monthlyRate = annualRate / 12 / 100;
		var months = years * 12;
		var futureValue = 0;

		for ( i = 1; i <= months; i++ ) {
			futureValue = ( futureValue + investment ) *
				(1 + monthlyRate);
		}
		$("futureValue").value = futureValue.toFixed(2);
	} 
}
var clear_click = function () {
	var investment = parseFloat();
    var annualRate = parseFloat();
    var years = parseInt();
}
window.onload = function () {
    $("calculate").onclick = calculate_click;
    $("investment").focus();
}

This post has been edited by Dormilich: 31 August 2011 - 10:07 PM
Reason for edit:: please use [code] /* your code source here */ [/code] tags when posting code


Is This A Good Question/Topic? 0
  • +

Replies To: event handler named clear_click that clears text boxes

#2 codeprada  Icon User is offline

  • Changed Man With Different Priorities
  • member icon

Reputation: 948
  • View blog
  • Posts: 2,357
  • Joined: 15-February 11

Re: event handler named clear_click that clears text boxes

Posted 31 August 2011 - 07:47 AM

Have you tried the error console? Please post all code in code tags.
Was This Post Helpful? 0
  • +
  • -

#3 VolcomMky  Icon User is offline

  • D.I.C Regular

Reputation: 74
  • View blog
  • Posts: 315
  • Joined: 13-May 09

Re: event handler named clear_click that clears text boxes

Posted 31 August 2011 - 08:05 AM

First, I think you need to declare some of your variables globally (outside of the functions)

var investment = parseFloat();
var annualRate = parseFloat();
var years = parseInt();


And then inside of the functions remove the word "var" because they have already been declared.
Settings them globally will allow you to make them usable across the page and all functions instead of function specific.

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

var calculate_click = function () 
{
	investment = parseFloat( $("investment").value );
	annualRate = parseFloat( $("rate").value );
	years = parseInt( $("years").value );
	
	$("futureValue").value = "";
	
	if (isNaN(investment) || investment <= 0) 
	{
		alert("Investment must be a valid number\nand greater than zero.");
	}
	else if(isNaN(annualRate) || annualRate > 20) 
	{
		alert("Annual rate must be a valid number\nand less than or equal to 20.");
	}
	else if(isNaN(years) || years > 50)
	{
		alert("Years must be a valid number\nand less than or equal to 50.");
	}
	else
	{
		var monthlyRate = annualRate / 12 / 100;
		var months = years * 12;
		var futureValue = 0;
		
		for ( i = 1; i <= months; i++ ) 
		{
			futureValue = ( futureValue + investment ) * (1 + monthlyRate);
		}
		$("futureValue").value = futureValue.toFixed(2);
	} 
	}

var clear_click = function () 
{
	investment = false;
	annualRate = false;
	years = false;
}
window.onload = function () 
{
	$("calculate").onclick = calculate_click;
	$("investment").focus();
} 

Was This Post Helpful? 0
  • +
  • -

#4 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3577
  • View blog
  • Posts: 10,442
  • Joined: 08-June 10

Re: event handler named clear_click that clears text boxes

Posted 31 August 2011 - 10:13 PM

global variables should only be used when absolutely necessary (they can throw up your code when one function interferes with another).

just for clearing the text fields, they are unnecessary anyways. if possible, use a HTML reset button or set the value of the appropriate fields to empty otherwise.
var clear_click = function ()
{
    $("investment").value = "";
    $("rate").value = "";
    $("years").value = "";
}

This post has been edited by Dormilich: 31 August 2011 - 10:13 PM

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1