1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

need help with aquarium volume calculator

Discussion in 'HTML & Website Design' started by CarpCharacin, Apr 30, 2016.

  1. #1
    I have a javascript aquarium volume calculator located here http://utahfishkeepers.us/page/volumecalculator. Here is the code:
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://www.fishlore.com/scripts/js/share.js"></script>
    <script type="text/javascript">
    var result = 0;
    var roundLength = 2;
      function computeGallons()
    {
        result = Math.round((document.frmMain.TankLength.value * document.frmMain.TankWidth.value * document.frmMain.TankHeight.value / 231)*100)/100;
        document.frmMain.USGallons.value = Math.round(result*100)/100;
    }
    </script>
    <form name="frmMain"><span class="b">Aquarium Calculator: Calculate Rectangle Fish Tank Volume in Gallons Based on Tank Size</span><p>
      
            Fish Tank Length in Inches:<br />
            <input type="text" name="TankLength" onkeyup="computeGallons()"><br />
            <br />
            Fish Tank Width in Inches:<br />
            <input type="text" name="TankWidth" onkeyup="computeGallons()"><br />
            <br />
            Fish Tank Height in Inches:<br />
            <input type="text" name="TankHeight" onkeyup="computeGallons()"><br />
            <br />
            Aquarium Size is<br />
            <input type="text" name="USGallons"> US Gallons<br />
            <br />
          
    </form>
    Code (JavaScript):
    The volume after the data is entered is in a box as if you were to enter it. Could someone help me? I am not very good with javascript. I would ideally like to have a button that people click to calculate the volume and then the volume will not come out in an input box.
     
    Solved! View solution.
    CarpCharacin, Apr 30, 2016 IP
  2. hdewantara

    hdewantara Well-Known Member

    Messages:
    536
    Likes Received:
    47
    Best Answers:
    25
    Trophy Points:
    155
    #2
    If you don't like people to input anything into the output volume box,
    just add "readonly" attribute to it?
     
    hdewantara, May 1, 2016 IP
  3. CarpCharacin

    CarpCharacin Active Member

    Messages:
    325
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    90
    #3
    How do i do that?
     
    CarpCharacin, May 3, 2016 IP
  4. hdewantara

    hdewantara Well-Known Member

    Messages:
    536
    Likes Received:
    47
    Best Answers:
    25
    Trophy Points:
    155
    #4
    <input type="text" name="USGallons" readonly="readonly"/>
    HTML:
    But perhaps this might look better with code below (using span element instead of input):
    <!-- form.frmMain -->
    <form name="frmMain" onsubmit="return computeGallons();">
        <span>Aquarium Calculator: Calculate Rectangle Fish Tank Volume in Gallons Based on Tank Size</span>
        <p>
            <label>Fish Tank Length in Inches:<br/>
                <input type="text" name="TankLength"/>
            </label><br/>
          
            <label>Fish Tank Width in Inches:<br/>
                <input type="text" name="TankWidth"/>
            </label><br/>
          
            <label>Fish Tank Height in Inches:<br/>
                <input type="text" name="TankHeight"/>
            </label><br/>
          
            <input type="submit" value="Calculate"/><br/>
          
            <label>Aquarium Size is:</label><br/>
            <span id="USGallons">US Gallons</span>
        </p>
    </form>
    
    <!-- script for the form.frmMain -->
    <script type="text/javascript">
        function computeGallons(){
            document.getElementById('USGallons').childNodes[0].nodeValue = (
                document.frmMain.TankLength.value *
                document.frmMain.TankWidth.value *
                document.frmMain.TankHeight.value / 231
            ).toFixed(2) + ' US Gallons';
            return false;
        }
    </script>
    
    HTML:
     
    hdewantara, May 3, 2016 IP
  5. #5
    qwikad.com, May 4, 2016 IP