SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Feb 2010
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Basic JS failing in Firefox 'is not defined' error. Anyone tell me why?

    Hi all, whilst I'm competent with XHTML/CSS I'm a JS beginner. This is a basic piece of javascript which is working fine in IE and Safari but not in Firefox 3. Can anyone tell me why?

    The error I get is 'concrete is not defined'. The error occurs when pressing the 'volume' button on the form...

    Here is the full HTML of the test page:

    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>
    <title>concrete and ballast calculator</title>
    
    <script type="text/javascript">
    function volume()
    {
    concrete.cums.value=(Math.round(concrete.width.value*concrete.depth.value*concrete.height.value*100))/100;
    }
    
    function calcQs()
    {
    cubems=concrete.cums.value;
    
    concrete.cement.value=Math.round(cubems*320)+" kgs";
    concrete.sand.value=Math.round(cubems*600)+" kgs";
    concrete.gravel.value=Math.round(cubems*1200)+" kgs";
    concrete.water.value=Math.round(cubems*176)+" ltrs";
    }
    </script>
    
    </head>
    <body>
    <form name="concrete" id="concrete" action="post" onsubmit="return false">
               Concrete Calculator 1.2.4 ratio
            Width<input name="width" type="text" id="width" size="20" />
            Length<input name="height" type="text" size="20" />
            Depth<input name="depth" type="text" id="depth" size="20" />
            <input type="button" value="Volume" name="volumeCalc" onclick="return volume()" />
              Cubic Meters<input type="text" name="cums" size="20" />
                  <input type="button" value="Quantities" onclick="return calcQs()" name="quantities" />
              Cement<input type="text" name="cement" size="20" />
              Sharp Sand<input type="text" name="sand" size="20" />
              Gravel<input type="text" name="gravel" size="20" />
              Water (liters)<input type="text" name="water" size="20" />                  
    </form>
    </body>
    </html>

  2. #2
    SitePoint Member cssbleach's Avatar
    Join Date
    May 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi benfrain

    You are not getting the html element correctly.

    So instead just concrete.cums.value, for example, add document to it i.e document.concrete.cums.value

    Don't forget to always start with document since all HTML tags belong to to the document object in the DOM (Document Object Model) hierarchy.

    And also, make a variable of the statment you going to use more than one time, it make easy, like this:

    var concreteForm = document.concrete;

  3. #3
    SitePoint Member
    Join Date
    Feb 2010
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi cssbleach, thanks for taking the time to respond and also explain. It makes more sense to me now, and most importantly - works perfect with no errors!

    Thanks

  4. #4
    SitePoint Member cssbleach's Avatar
    Join Date
    May 2010
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You are welcome, benfrain.

  5. #5
    dooby dooby doo silver trophybronze trophy
    spikeZ's Avatar
    Join Date
    Aug 2004
    Location
    Manchester UK
    Posts
    13,788
    Mentioned
    151 Post(s)
    Tagged
    3 Thread(s)
    nice explanation cssbleach
    Mike Swiffin - Community Team Advisor
    Only a woman can read between the lines of a one word answer.....


Bookmarks

Posting Permissions

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