Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Declaring Variables in JavaScript

Status
Not open for further replies.
NeckBone

NeckBone

Programmer
Joined
Oct 15, 2003
Messages
47
Location
US
Howdy Partners,

I could use some help if someone has the time, I would really appreciate it immensely.

Concerning variables. I don't know the official way to declare a Public or Global variable. In other words, a variable that is common to say, four functions.

Also, when I use the variable across multiple functions like passing the variable to anothet function and returning a boolean.

Should I use it like such "var nextChar" or "nextChar". I've looked and looked for info but just can't seem to find any clear info.

Please help.

Here's some code I wrote and currently working on. This code does work without errors though I get a NaN when I try to validate two empty textBoxes.

Please tell me where I should do what with variables.

This takes strings from two textBoxes, validates the entries as numbers, adds the two numbers, and displays the result in a third textBox.

<script language="JavaScript">
!<--
function formFocus() {
document.myform.boxA.focus(); //gives focus to boxA on Load
document.myform.boxA.value=""; //clears boxA on Load
document.myform.boxB.value=""; //clears boxB on Load
document.myform.sum.value=""; //clears Total on Load
}

function isEmpty(hey, you) {
var hey;
var you;
if ((hey == "") || (you == ""))
{ return true; }
}

function isNumber(hey, you) {
var hey;
var you;
var valid = "0123456789";
var result = false;
for (var x=0; x < hey.length; x++) {
var charX = hey.charAt(x);
if (valid.indexOf(charX) == -1)
{ result = true;
var a = true;
document.myform.boxA.value="";
document.myform.boxA.focus();
break;
}
}
for (var x=0; x < you.length; x++) {
var charX = you.charAt(x);
if (valid.indexOf(charX) == -1)
{ result = true;
var b = true;
document.myform.boxB.value="";
document.myform.boxB.focus();
break;
}
}
if ((a == true) && (b == true))
document.myform.boxA.focus();
return result;
}

function docOpen() {
var hey = document.myform.boxA.value; //assigns value of boxA to var hey
var you = document.myform.boxB.value; //assigns value of boxA to var hey
if ( isEmpty(hey,you) == true)
{ alert('You must enter numbers in both Box 1 and Box 2'); }
if ( isNumber(hey,you) == true)
{ alert('You must enter numbers only'); }
else {
var total = parseFloat(you) + parseFloat(hey);
document.myform.sum.value= total; }
//-->
</script>
 
Sort by date Sort by votes

To delcare a global variable, simply declare it outside of a function:

Code: 
var globalInt = 56;
var globalFloat = 22.3;

function number1() {
   var localInt = 45;
   alert(globalFloat);  // shows 22.3
}

JavaScript is an untyped language, although you can typecast, should you need to. This means that you can define a variable, and change its type, or use it as another type, without too many problems.

Incidentally, JavaScript has a "isNaN" function, which will tell you if a variable is/contains/holds a valid number or not - so you can replace your "isNumber" function with somethin like this:

Code: 
if (isNaN(varToCheck)) alert('This is non a number!');

Hope this helps,
Dan
 
Upvote 0 Downvote
Thanks Dan.

I am grateful.

I do a little C++ and VB.Net and declaring public variables seems to be about the same in those languages.

I tried declaring the global variables like this On Top outside the functions and it won't validate:

var hey = document.myform.boxA.value; var you = document.myform.boxB.value;

Maybe I had some other prob, I'll give it another shot.
 
Upvote 0 Downvote
I nailed it. I feel like a dork!

I declared var hey and var you first in my docOpen function which was the first function in the program. Therefore, I had to keep declaring var hey and var you in the newer functions.

Declaring variables looks to be pretty much the same as C++ as far as I can see.

Thanks for your help and here's the code with the variables declared globally.

<html>
<head>
<title>A Form</title>
<style>
<!--
body { background-color: #FFFF99; font-family: Verdana, Tahoma, sans-serif; font-size: 14px; color: #0000FF;
}
table.bor { border-top: 1px solid #666699; border-right: 1px solid #666699; border-bottom: 1px solid #666699; border-left: 1px solid #666699; font-size: 12px;
}
div.biff { position: relative; left: 0%; top: 5%; text-align: center;
}
-->
</style>

<script language="javascript">
<!--

var hey;
var you;

function formFocus() {
document.myform.boxA.focus(); //gives //focus to boxA on Load
document.myform.boxA.value=""; //clears //boxA on Load
document.myform.boxB.value=""; //clears //boxB on Load
document.myform.sum.value=""; //clears //total on Load
}

function isCrap(hey, you) {
if ((hey == "") || (you == ""))
{ return true; }
}

function isComma(hey,you) {
var valid = ",";
var result = false;
for (var x=0; x < hey.length; x++) {
var charX = hey.charAt(x);
if (valid.indexOf(charX) == 0)
{ result = true;
break;
}
}
for (var x=0; x < you.length; x++) {
var charX = hey.charAt(x);
if (valid.indexOf(charX) == 0)
{ result = true;
break;
}
}
return result;
}

function isNumber(hey,you) {
var valid = ".0123456789";
var result = false;
for (var x=0; x < hey.length; x++) {
var charX = hey.charAt(x);
if (valid.indexOf(charX) == -1)
{ result = true;
var a = true;
document.myform.boxA.value="";
document.myform.boxA.focus();
break;
}
}
for (var x=0; x < you.length; x++) {
var charX = you.charAt(x);
if (valid.indexOf(charX) == -1)
{ result = true;
var b = true;
document.myform.boxB.value="";
document.myform.boxB.focus();
break;
}
}
if ((a == true) && (b == true))
document.myform.boxA.focus();
return result;
}

function docOpen() {

hey = document.myform.boxA.value;
you = document.myform.boxB.value;
if ( isCrap(hey,you) == true)
{ alert('Enter Whole Numbers or Decimal Numbers in both Box 1 and Box 2'); }
if ( isComma(hey,you) == true)
{ alert('Do Not Use Commas!'); }
if ( isNumber(hey,you) == true)
{ alert('Enter Whole Numbers or \n Decimal Numbers only. \n No other characters are allowed.'); }
else {
var total = parseFloat(you) + parseFloat(hey);
document.myform.sum.value = total; } //Remove //this curly bracket for new window


//The code below that's commented out will open a new //window and display result of calculation
//but you must remove the Curly Bracket above where it //says "Remove this for new window". Also, //remove the /* and */ around the code block below. Don't remove anything else.

/* document.open();
document.write ( "<br><br><br><br>");
document.write ("<body bgcolor=#FFFF00 >");
document.write ("<div align=center>");
document.write ( "<font face=verdana>");
document.write ( hey + "+" + you + "=" + total + "<br>");
document.write ( total + "<br>")
document.write ( "</font>")
document.write("<input type=button onclick=window.history.back() value=Close>");
document.write ("</div>");
document.write ("</body>");
document.close(); }
*/

}
//These same functions can be modified to validate text or //character input.

//-->
</script>

</head>
<body onload="formFocus()">
<form name="myform" id="myform">
<div class="biff">
<span style="font-weight: bold; color: #333399;">Howdy</span><br>This deal is for validation. It adds two numbers for posterity. It validates that<br>an entry has been made and also validates that the entry is numeric.
<br><br>
<table class="bor" width="620" cellspacing="0" cellpadding="0" border="0">
<th>
<br>
Enter numbers in Box 1 and Box 2
<br>
<br>
</th>
<tr>
<td align="center">
Box 1&nbsp;&nbsp;<input type="text" name="boxA" id="boxA" value="" maxLength="8" size="10"">
<br>
<br>
</td>
</tr>
<tr>
<td align="center">
Box 2&nbsp;&nbsp;<input type="text" name="boxB" id="boxB" value="" maxLength="8" size="10">
<br>
<br>
</td>
</tr>
<tr>
<td align="center">
<input type="button" onclick="docOpen()" value="Total" style="background-color: #000080; color: #FFFFFF; width: 60;">
<br>
<br>
</td>
</tr>
<tr>
<td align="center">
Total&nbsp;&nbsp;<input type="text" name="sum" id="sum" value="" maxLength="12" size="10">
<br>
<br>
</td>
</tr>
<tr>
<td align="center">
<input type="reset" onclick="reset()" value="Reset" style="background-color: #000080; color: #FFFFFF; width: 60;">
<br>
<br>
</td>
</tr>
<tr>
<td align="center">
<span style="color: #FF0000; font-size: 12px;">* If you don't enter numbers in Box 1 and/or Box 2, you'll get an alert.<br>You'll get an alert if your entries are not numeric.</span><br>
<br>
<span style="color: #0000FF; font-size: 10px;">Screwing Around</span></span>
</td>
</tr>
</table>
</div>
</form>

 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
1K
lexer
lexer
Mike Lewis
  • Locked
  • Question Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid)
Replies
5
Views
2K
Mike Lewis
Mike Lewis
JScannell
  • Locked
  • Question Question
Javascript events
Replies
1
Views
618
Daniel K
Daniel K
Marclem
  • Locked
  • Question Question
javascript:navigator.registerProtocolHandler
Replies
1
Views
627
Marclem
Marclem
JScannell
  • Locked
  • Question Question
Javascript issue on iPhone/iMac platforms
Replies
0
Views
944
JScannell
JScannell

Part and Inventory Search

Sponsor

Back
Top