Javascript: function not defined error message

Question

I have this simple example code, 3 textboxes. If I write numbers in the first two, it multiplies them and writes the result in the third one. However, if I run the code, I get an error saying: "ReferenceError: calc is not defined". Am I missing something?

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script language="text/javascript">
    function calc()
    {
        var txt1 = (float) document.getElementById('text1').value;
        var txt2 = (float) document.getElementById('text2').value;
        document.getElementById('text3').value = (txt1 * txt2);
    }
 </script>
</head>
<body>
    <table>
        <tr>
            <td><input type="text" id="text1" name="text1"></td>
            <td><input type="text" id="text2" name="text2" onkeypress="calc();"></td>
            <td><input type="text" id="text3" name="text3"></td>
       </tr>
   </table>
</body>
</html>

Update: Whoever wrote that "(float)" is causing the problem, was right. Thanks for the help.

user2314737 · Accepted Answer · 2015-04-13 09:27:38Z

4

Try to use parseFloat to cast to float

function calc()
{
    var txt1 = parseFloat(document.getElementById('text1').value);
    var txt2 = parseFloat(document.getElementById('text2').value);
    document.getElementById('text3').value = (txt1 * txt2);
}

answered Apr 13, 2015 at 9:27

user2314737

29.7k20 gold badges109 silver badges126 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

08Dc91wk · Accepted Answer · 2015-04-13 09:35:41Z

1

The reason you are getting that error is because the function you have defined there is invalid, so it is not loaded. The problem lies with (float) - you can't typecast like that in JavaScript.

Use the parseFloat() function as follows:

var txt1 = parseFloat(document.getElementById('text1').value);

Note that Rajesh is also correct in that you need to change

<script language="text/javascript">

to

<script type="text/javascript">

The complete, correct script is as follows:

<script type="text/javascript">
    function calc()
    {
        var txt1 = parseFloat(document.getElementById('text1').value);
        var txt2 = parseFloat(document.getElementById('text2').value);
        document.getElementById('text3').value = (txt1 * txt2);
    }
 </script>

edited Apr 13, 2015 at 9:35

answered Apr 13, 2015 at 9:28

08Dc91wk

4,3388 gold badges37 silver badges68 bronze badges

Comments

Moishe Lipsker · Accepted Answer · 2015-04-13 10:07:45Z

1

1) Try changing

<script language="text/javascript">

to

<script type="text/javascript">

If you would like to use the deprecated language attribute you could do:

<script language="Javascript">

Additionally, as others have already pointed out that to get a float from a string you can use parseFloat and pass the string as a parameter. Using (float) is often used in Java to convert from a numeric type such as double or int to float.

2) Try changing

var txt1 = (float) document.getElementById('text1').value;
var txt2 = (float) document.getElementById('text2').value;

to

var txt1 = parseFloat(document.getElementById('text1').value;
var txt2 = parseFloat(document.getElementById('text2').value;

edited Apr 13, 2015 at 10:07

answered Apr 13, 2015 at 9:23

Moishe Lipsker

3,0322 gold badges24 silver badges29 bronze badges

2 Comments

Peter Herdenborg Over a year ago

Useful information but won't actually fix the problem.

Moishe Lipsker Over a year ago

@Peter Herdenborg Updated answer.

gothy · Accepted Answer · 2015-04-13 09:30:58Z

0

Use parseFloat() instead of (float)

answered Apr 13, 2015 at 9:30

gothy

1821 silver badge6 bronze badges

Comments

Kishan · Accepted Answer · 2015-04-13 11:00:31Z

-1

try this Demo

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <script type="text/JavaScript">
    function calc()
    {
        var txt1 = document.getElementById('text1');
        var txt2 = document.getElementById('text2');
        document.getElementById('text3').value = (parseFloat(txt1.value) * parseFloat(txt2.value));
    }
 </script>
</head>
<body>
    <table>
        <tr>
            <td><input type="text" id="text1" name="text1" value=""></td>
            <td><input type="text" id="text2" name="text2"   value=""></td>
            <td><input type="text" id="text3" name="text3" onkeypress="calc()" value=""></td>
       </tr>
   </table>     
</body>    
</html>

edited Apr 13, 2015 at 11:00

answered Apr 13, 2015 at 9:38

Kishan

1,21014 silver badges26 bronze badges

Comments

Rajesh Kumar · Accepted Answer · 2015-04-13 09:26:20Z

-2

use this line <script language="javascript" type="text/javascript">

answered Apr 13, 2015 at 9:26

Rajesh Kumar

941 silver badge14 bronze badges

1 Comment

Peter Herdenborg Over a year ago

This won't help and the language attribute is deprecated.

Andreas K · Accepted Answer · 2015-04-13 09:29:24Z

-2

I is the (float) casting that causes the problem.

answered Apr 13, 2015 at 9:29

Andreas K

2222 silver badges11 bronze badges

2 Comments

Roope Hakulinen Over a year ago

Okay, what and how does it cause? Also how to solve it?

Andreas K Over a year ago

You see the update comment from the question? So thx a lot for stupidly downvote ...

Collectives™ on Stack Overflow

Javascript: function not defined error message

7 Answers 7

Comments

Comments

2 Comments

Comments

Comments

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

2 Comments

Comments

Comments

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related