www.webdeveloper.com
Results 1 to 2 of 2

Thread: Input boxes/Calc function

  1. #1
    Join Date
    Oct 2009
    Posts
    7

    Input boxes/Calc function

    Hello All,

    I'm doing an assignment to make input boxes where I can perform different functions like adding, subtracting, multiplying, dividing, modulus, and isEven.

    Here is the javascript I wrote for addition:

    <SCRIPT language = JavaScript>
    function calculate() {
    A = document.frmOne.txtFirstNumber.value
    B = document.frmOne.txtSecondNumber.value
    A = Number(A)
    B = Number(B)
    C = (A + B)
    document.frmOne.txtThirdNumber.value = C
    }
    </script>

    and in the html:

    <FORM NAME = frmOne>
    Number One:
    <INPUT TYPE = Text NAME = txtFirstNumber SIZE = 5 value ="">
    Number Two:
    <INPUT TYPE = Text NAME = txtSecondNumber SIZE = 5 value ="">
    <P> Total:
    <INPUT TYPE = Text NAME = txtThirdNumber SIZE = 5 value = "">
    <P>
    <Input Type = Button NAME = b1 VALUE = "Add Numbers" onClick = calculate()>
    </FORM>

    If anyone can point me in the right direction, I would appreciate it. I think I'm not understanding the similar code in the function javascript and the html code to activate the function. Any help/advice would be great

    Thanks

  2. #2
    Join Date
    Oct 2009
    Posts
    46

    It works...

    By simply putting your script code before the ending HEAD tag, and putting your form in between the BODY tags, this seems to work fine in IE and FF. Although I would suggest paying more attention to consistency - i.e., quote all paramaters, end script statements with ;, etc...

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <SCRIPT language = JavaScript>
    function calculate() {
    A = document.frmOne.txtFirstNumber.value
    B = document.frmOne.txtSecondNumber.value
    A = Number(A)
    B = Number(B)
    C = (A + B)
    document.frmOne.txtThirdNumber.value = C
    }
    </script>
    
    </head>
    
    <body>
    <FORM NAME = frmOne>
    Number One: 
    <INPUT TYPE = Text NAME = txtFirstNumber SIZE = 5 value ="">
    Number Two: 
    <INPUT TYPE = Text NAME = txtSecondNumber SIZE = 5 value ="">
    <P> Total: 
    <INPUT TYPE = Text NAME = txtThirdNumber SIZE = 5 value = "">
    <P> 
    <Input Type = Button NAME = b1 VALUE = "Add Numbers" onClick = calculate()>
    </FORM>
    
    </body>
    </html>

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles