Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 15 of 15
  1. #1
    New to the CF scene
    Join Date
    Mar 2012
    Location
    SoCal
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Javascript Weight Converter Help?

    Hello all. I'm so glad i found this forum!!! This looks like a great coding community. This will be my First Post.

    I was wondering if you guys can help me with my weight converter. I cant seem to make it work properly on my site.

    here is the code im using:

    <p class="about">Convert weight measurements between U.S./Imperial and SI (Metric) units<br /> Type your value in a box, click the <input onclick="alert('Not this button!')" type="button" name="test_bt" value="Go!" /> and all unit conversions in the same category will be calculated.</p>
    <form action="">
    <table width="500" border="1" cellspacing="0" cellpadding="4">
    <tbody>
    <tr bgcolor="#0066ff"><th class="headings" colspan="3" bgcolor="#1765BB">SI (Metric)</th></tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Tonne</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="mTon" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(mTon.value)) compute(this.form,mTon.name,weight_data)" type="button" name="mTon_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Kilogram (kg)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="mKilogram" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(mKilogram.value)) compute(this.form,mKilogram.name,weight_data)" type="button" name="mKilogram_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Gram (g)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="mGram" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(mGram.value)) compute(this.form,mGram.name,weight_data)" type="button" name="mGram_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Milligram (mg)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="mMilligram" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(mMilligram.value)) compute(this.form,mMilligram.name,weight_data)" type="button" name="mMilligram_bt" value="Go!" /></td>
    </tr>
    <tr><th class="headings" colspan="3" bgcolor="#103e78"> </th></tr>
    <tr bgcolor="#0066ff"><th class="headings" colspan="3" bgcolor="#1765BB">Troy weight</th></tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Pound (lb t)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="troyPound" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(troyPound.value)) compute(this.form,troyPound.name,weight_data)" type="button" name="troyPound_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Ounce (oz t)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="troyOunce" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(troyOunce.value)) compute(this.form,troyOunce.name,weight_data)" type="button" name="troyOunce_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">PennyWeight (dwt)</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="troyDWT" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(troyDWT.value)) compute(this.form,troyDWT.name,weight_data)" type="button" name="troyDWT_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" width="288">Grain<br /> Same as Avoirdupois grain</td>
    <td class="headings" align="right" bgcolor="#103e78" width="130"><input type="text" name="troyGrain" size="15" /></td>
    <td class="headings" bgcolor="#103e78" width="57"><input onclick="if (checkNum(troyGrain.value)) compute(this.form,troyGrain.name,weight_data)" type="button" name="troyGrain_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#6699ff">
    <td class="headings" colspan="3" bgcolor="#103e78"> </td>
    </tr>
    <tr bgcolor="#0066ff"><th class="headings" colspan="3" bgcolor="#1765BB">Avoirdupois weight</th></tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">British ("long") ton</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="briTon" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(briTon.value)) compute(this.form,briTon.name,weight_data)" type="button" name="briTon_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">US ("short") ton</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="usTon" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(usTon.value)) compute(this.form,usTon.name,weight_data)" type="button" name="usTon_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78" height="42">British ("long") hundredweight (cwt)</td>
    <td class="headings" align="right" bgcolor="#103e78" height="42"><input type="text" name="briCWT" size="15" /></td>
    <td class="headings" bgcolor="#103e78" height="42"><input onclick="if (checkNum(briCWT.value)) compute(this.form,briCWT.name,weight_data)" type="button" name="briCWT_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">US ("short") hundredweight (cwt)</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="usCWT" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(usCWT.value)) compute(this.form,usCWT.name,weight_data)" type="button" name="usCWT_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">Stone</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="briStone" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(briStone.value)) compute(this.form,briStone.name,weight_data)" type="button" name="briStone_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">Pound (lb)</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="avdpPound" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(avdpPound.value)) compute(this.form,avdpPound.name,weight_data)" type="button" name="avdpPound_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">Ounce (oz)</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="avdpOunce" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(avdpOunce.value)) compute(this.form,avdpOunce.name,weight_data)" type="button" name="avdpOunce_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">Dram (dr)</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="avdpDram" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(avdpDram.value)) compute(this.form,avdpDram.name,weight_data)" type="button" name="avdpDram_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" bgcolor="#103e78">Grain</td>
    <td class="headings" align="right" bgcolor="#103e78"><input type="text" name="avdpGrain" size="15" /></td>
    <td class="headings" bgcolor="#103e78"><input onclick="if (checkNum(avdpGrain.value)) compute(this.form,avdpGrain.name,weight_data)" type="button" name="avdpGrain_bt" value="Go!" /></td>
    </tr>
    <tr bgcolor="#0066ff">
    <td class="headings" colspan="2" align="center" bgcolor="#103e78"><input onclick="resetAll(this.form)" type="button" name="res7" value="Clear all numbers" /></td>
    <td class="headings" bgcolor="#103e78"> </td>
    </tr>
    </tbody>
    </table>
    <p> </p>
    </form>
    <p> </p>


    and help will be greatly appreciated.

  • #2
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    Quote Originally Posted by deekay View Post
    I cant seem to make it work properly on my site.
    What error messages are you getting and what is the code doing/not doing that it should/shouldn't?

    1) Although it's not against the rules to do homework for members, it is frowned upon though.

    2) Post the javascript you have so far and point out the area in it you are having difficulty with. I think you'll find most members don't see themselves as providers of a free code debugging service.

    3) To make your code easier to read, wrap it in code tags by first highlighting your code and then click the # icon in the post editor's toolbar.
    Last edited by webdev1958; 03-21-2012 at 11:26 PM.

  • Users who have thanked webdev1958 for this post:

    deekay (03-22-2012)

  • #3
    New to the CF scene
    Join Date
    Mar 2012
    Location
    SoCal
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by webdev1958 View Post
    What error messages are you getting and what is the code doing/not doing that it should/shouldn't?

    1) Although it's not against the rules to do homework for members, it is frowned upon though.

    2) Post the javascript you have so far and point out the area in it you are having difficulty with. I think you'll find most members don't see themselves as providers of a free code debugging service.

    3) To make your code easier to read, wrap it in code tags by first highlighting your code and then click the # icon in the post editor's toolbar.

    Ok i will double check. Because on my end i can see the Table just fine but when i input the amount i want to convert nothing happens... I guess im a just a java noob...

  • #4
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    Where are the functions your onclicks are calling?

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,922
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Quote Originally Posted by deekay View Post
    I guess im a just a java noob...
    Be aware that Java and Javascript are entirely different programming languages, in spite of the confusingly similar names. Rather like Austria and Australia!

    “Education is the process of casting imitation pearls before real swine” - Irwin Edman

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • #6
    New to the CF scene
    Join Date
    Mar 2012
    Location
    SoCal
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Philip M View Post
    Be aware that Java and Javascript are entirely different programming languages, in spite of the confusingly similar names. Rather like Austria and Australia!

    “Education is the process of casting imitation pearls before real swine” - Irwin Edman
    Im sorry i meant Javascript. I guess this is my first time really working with it. I usually work with PHP and HTML. But Javascript is like learning a whole new language.

    Here is my Weight Converter.

    http://colonialent.com/index.php/faq/weight-converter

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,922
    Thanks
    203
    Thanked 2,531 Times in 2,509 Posts
    Use your error console or Firebug. checkNum is undefined.

    You have already posted your HTML. Please do not post it again! But post your Javascript - don't be lazy and expect us to wade through code from a link to your site.

    All the code given in this post has been tested and is intended to address the question asked.
    Unless stated otherwise it is not just a demonstration.

  • Users who have thanked Philip M for this post:

    deekay (03-23-2012)

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    NONE of the code is on that page. checkNum and compute are both missing.

    You know, I thought this was homework, because of the way it was written!

    It's really time go to through all that HTML related to the weight table and clean it up an way way way simplify the onclick stuff!

    All you really need for each onclick is onclick="compute(this);"

    The rest of that stuff in onclick is just a waste.

    Anyway, if you can AT LEAST show us the table of multiplier values you intend to use, the code is pretty much dirt easy.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    Here, try this for a starting point:
    Code:
    <style type="text/css">
    table#WEIGHTS { 
        width: 500px;
        color: lightgrey;
    }
    table#WEIGHTS tr {
        background-color: #0066ff;
    }
    table#WEIGHTS th.headings {
        background-color: #1765BB;
    }
    table#WEIGHTS td.headings {
        background-color: #103e78;
    }
    table#WEIGHTS td.right {
        text-align: right;
    }
    </style>
    <script type="text/javascript">
    function compute(btn)
    {
        var node = btn;
        while ( node.tagName.toUpperCase() != "TR" )
        {
            node = node.parentNode;
        }
        var inp = node.getElementsByTagName("input")[0];
        var weightName = inp.name;
        var value = parseFloat(inp.value);
        if ( isNaN(value) )
        {
            inp.value = "";
            alert("Not a legal number; retry");
        }
    }
    </script>
    
        
    <form action="">
    <table id="WEIGHTS" border="1" cellspacing="0" cellpadding="4">
    <tbody>
    <tr><th class="headings" colspan="3">SI (Metric)</th></tr>
    <tr>
        <td class="headings" width="288">Tonne</td>
        <td class="headings right" width="130"><input type="text" name="mTon" size="15" /></td>
        <td class="headings" width="57"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Kilogram (kg)</td>
        <td class="headings right" width="130"><input type="text" name="mKilogram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Gram (g)</td>
        <td class="headings right"><input type="text" name="mGram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Milligram (mg)</td>
        <td class="headings right"><input type="text" name="mMilligram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr><th class="headings" colspan="3"> </th></tr>
    <tr><th class="headings" colspan="3">Troy weight</th></tr>
    <tr>
        <td class="headings">Pound (lb t)</td>
        <td class="headings right"><input type="text" name="troyPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz t)</td>
        <td class="headings right"><input type="text" name="troyOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">PennyWeight (dwt)</td>
        <td class="headings right"><input type="text" name="troyDWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain<br /> Same as Avoirdupois grain</td>
        <td class="headings right"><input type="text" name="troyGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr bgcolor="#6699ff">
        <td class="headings" colspan="3"> </td>
    </tr>
    <tr><th class="headings" colspan="3">Avoirdupois weight</th></tr>
    <tr>
        <td class="headings">British ("long") ton</td>
        <td class="headings right"><input type="text" name="briTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") ton</td>
        <td class="headings right"><input type="text" name="usTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" height="42">British ("long") hundredweight (cwt)</td>
        <td class="headings right" height="42"><input type="text" name="briCWT" size="15" /></td>
        <td class="headings" height="42"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") hundredweight (cwt)</td>
        <td class="headings right"><input type="text" name="usCWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Stone</td>
        <td class="headings right"><input type="text" name="briStone" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Pound (lb)</td>
        <td class="headings right"><input type="text" name="avdpPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz)</td>
        <td class="headings right"><input type="text" name="avdpOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Dram (dr)</td>
        <td class="headings right"><input type="text" name="avdpDram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain</td>
        <td class="headings right"><input type="text" name="avdpGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" colspan="3" align="center"><input type="reset" value="Clear all numbers" /></td>
    </tr>
    </tbody>
    </table>
    But it of course needs your table of multipliers before it can actually compute anything.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    Oh, what the heck.

    Here. Couldn't help myself. But *YOU* get to find the rest of the multipliers!

    Code:
    <style type="text/css">
    table#WEIGHTS { 
        width: 500px;
        color: lightgrey;
    }
    table#WEIGHTS tr {
        background-color: #0066ff;
    }
    table#WEIGHTS th.headings {
        background-color: #1765BB;
    }
    table#WEIGHTS td.headings {
        background-color: #103e78;
    }
    table#WEIGHTS td.right {
        text-align: right;
    }
    </style>
    <script type="text/javascript">
    var multipliers = {
        "mMilligram" : 1,
        "mGram" : 1000,
        "mKilogram" : 1000000,
        "avdpOunce" : 28349.523125,
        "avdpPound" : 16 * 28349.523125,
        "usTon" : 2000 * 16 * 28349.523125
    }
    
    function compute(btn)
    {
        var form = btn.form;
        var node = btn;
        while ( node.tagName.toUpperCase() != "TR" )
        {
            node = node.parentNode;
        }
        var inp = node.getElementsByTagName("input")[0];
        var weightName = inp.name;
        var value = parseFloat(inp.value);
        if ( isNaN(value) )
        {
            inp.value = "";
            alert("Not a legal number; retry");
        }
        
        // convert the value to milligrams:
        var mgs = value * multipliers[weightName];
        
        // and now fill in all known weights:
        for ( var wname in multipliers )
        {
            form[wname].value = mgs / multipliers[wname];
        }   
    }
    </script>
    
        
    <form action="">
    <table id="WEIGHTS" border="1" cellspacing="0" cellpadding="4">
    <tbody>
    <tr><th class="headings" colspan="3">SI (Metric)</th></tr>
    <tr>
        <td class="headings" width="288">Tonne</td>
        <td class="headings right" width="130"><input type="text" name="mTon" size="15" /></td>
        <td class="headings" width="57"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Kilogram (kg)</td>
        <td class="headings right" width="130"><input type="text" name="mKilogram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Gram (g)</td>
        <td class="headings right"><input type="text" name="mGram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Milligram (mg)</td>
        <td class="headings right"><input type="text" name="mMilligram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr><th class="headings" colspan="3"> </th></tr>
    <tr><th class="headings" colspan="3">Troy weight</th></tr>
    <tr>
        <td class="headings">Pound (lb t)</td>
        <td class="headings right"><input type="text" name="troyPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz t)</td>
        <td class="headings right"><input type="text" name="troyOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">PennyWeight (dwt)</td>
        <td class="headings right"><input type="text" name="troyDWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain<br /> Same as Avoirdupois grain</td>
        <td class="headings right"><input type="text" name="troyGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr bgcolor="#6699ff">
        <td class="headings" colspan="3"> </td>
    </tr>
    <tr><th class="headings" colspan="3">Avoirdupois weight</th></tr>
    <tr>
        <td class="headings">British ("long") ton</td>
        <td class="headings right"><input type="text" name="briTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") ton</td>
        <td class="headings right"><input type="text" name="usTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" height="42">British ("long") hundredweight (cwt)</td>
        <td class="headings right" height="42"><input type="text" name="briCWT" size="15" /></td>
        <td class="headings" height="42"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") hundredweight (cwt)</td>
        <td class="headings right"><input type="text" name="usCWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Stone</td>
        <td class="headings right"><input type="text" name="briStone" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Pound (lb)</td>
        <td class="headings right"><input type="text" name="avdpPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz)</td>
        <td class="headings right"><input type="text" name="avdpOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Dram (dr)</td>
        <td class="headings right"><input type="text" name="avdpDram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain</td>
        <td class="headings right"><input type="text" name="avdpGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" colspan="3" align="center"><input type="reset" value="Clear all numbers" /></td>
    </tr>
    </tbody>
    </table>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    deekay (03-23-2012)

  • #11
    New to the CF scene
    Join Date
    Mar 2012
    Location
    SoCal
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Old Pedant View Post
    Oh, what the heck.

    Here. Couldn't help myself. But *YOU* get to find the rest of the multipliers!

    Code:
    <style type="text/css">
    table#WEIGHTS { 
        width: 500px;
        color: lightgrey;
    }
    table#WEIGHTS tr {
        background-color: #0066ff;
    }
    table#WEIGHTS th.headings {
        background-color: #1765BB;
    }
    table#WEIGHTS td.headings {
        background-color: #103e78;
    }
    table#WEIGHTS td.right {
        text-align: right;
    }
    </style>
    <script type="text/javascript">
    var multipliers = {
        "mMilligram" : 1,
        "mGram" : 1000,
        "mKilogram" : 1000000,
        "avdpOunce" : 28349.523125,
        "avdpPound" : 16 * 28349.523125,
        "usTon" : 2000 * 16 * 28349.523125
    }
    
    function compute(btn)
    {
        var form = btn.form;
        var node = btn;
        while ( node.tagName.toUpperCase() != "TR" )
        {
            node = node.parentNode;
        }
        var inp = node.getElementsByTagName("input")[0];
        var weightName = inp.name;
        var value = parseFloat(inp.value);
        if ( isNaN(value) )
        {
            inp.value = "";
            alert("Not a legal number; retry");
        }
        
        // convert the value to milligrams:
        var mgs = value * multipliers[weightName];
        
        // and now fill in all known weights:
        for ( var wname in multipliers )
        {
            form[wname].value = mgs / multipliers[wname];
        }   
    }
    </script>
    
        
    <form action="">
    <table id="WEIGHTS" border="1" cellspacing="0" cellpadding="4">
    <tbody>
    <tr><th class="headings" colspan="3">SI (Metric)</th></tr>
    <tr>
        <td class="headings" width="288">Tonne</td>
        <td class="headings right" width="130"><input type="text" name="mTon" size="15" /></td>
        <td class="headings" width="57"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Kilogram (kg)</td>
        <td class="headings right" width="130"><input type="text" name="mKilogram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Gram (g)</td>
        <td class="headings right"><input type="text" name="mGram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Milligram (mg)</td>
        <td class="headings right"><input type="text" name="mMilligram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr><th class="headings" colspan="3"> </th></tr>
    <tr><th class="headings" colspan="3">Troy weight</th></tr>
    <tr>
        <td class="headings">Pound (lb t)</td>
        <td class="headings right"><input type="text" name="troyPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz t)</td>
        <td class="headings right"><input type="text" name="troyOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">PennyWeight (dwt)</td>
        <td class="headings right"><input type="text" name="troyDWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain<br /> Same as Avoirdupois grain</td>
        <td class="headings right"><input type="text" name="troyGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr bgcolor="#6699ff">
        <td class="headings" colspan="3"> </td>
    </tr>
    <tr><th class="headings" colspan="3">Avoirdupois weight</th></tr>
    <tr>
        <td class="headings">British ("long") ton</td>
        <td class="headings right"><input type="text" name="briTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") ton</td>
        <td class="headings right"><input type="text" name="usTon" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" height="42">British ("long") hundredweight (cwt)</td>
        <td class="headings right" height="42"><input type="text" name="briCWT" size="15" /></td>
        <td class="headings" height="42"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">US ("short") hundredweight (cwt)</td>
        <td class="headings right"><input type="text" name="usCWT" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Stone</td>
        <td class="headings right"><input type="text" name="briStone" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Pound (lb)</td>
        <td class="headings right"><input type="text" name="avdpPound" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Ounce (oz)</td>
        <td class="headings right"><input type="text" name="avdpOunce" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Dram (dr)</td>
        <td class="headings right"><input type="text" name="avdpDram" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings">Grain</td>
        <td class="headings right"><input type="text" name="avdpGrain" size="15" /></td>
        <td class="headings"><input onclick="compute(this);" type="button"  value="Go!" /></td>
    </tr>
    <tr>
        <td class="headings" colspan="3" align="center"><input type="reset" value="Clear all numbers" /></td>
    </tr>
    </tbody>
    </table>
    GREAT! Thank you so much!!! I have and idea now. I didnt want to come off as lazy. Its just that this is new to me and Youtube tutorials aint really helping me. I'll do the Multipliers.... Thank guys!

  • #12
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    Hope you noticed how much unneeded stuff I pulled out of your HTML, thanks to CSS.

    I used milligram as the 1.000 base unit, because I assume it is the smallest value. I don't know how big "grain" is. But even if it's smaller, you don't need to make it the 1.0000 base. It's okay for it to have a fractional value.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #13
    New to the CF scene
    Join Date
    Mar 2012
    Location
    SoCal
    Posts
    5
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Old Pedant View Post
    Hope you noticed how much unneeded stuff I pulled out of your HTML, thanks to CSS.

    I used milligram as the 1.000 base unit, because I assume it is the smallest value. I don't know how big "grain" is. But even if it's smaller, you don't need to make it the 1.0000 base. It's okay for it to have a fractional value.
    I did notice the BIG change in the code. My old code reminds me of my old dorm room... Now the code is nice and tidy and oozes feng-sui. I cant tell you enough how thankful I truly am. *Question: So if i want to Label a basic milligram it would equal 1.000 and a gram would be .0001 ??

  • #14
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    Huh? No.

    All units are *MULTIPLE* of the basic weight unit.

    Notice that I assigned 1 (same as 1.000) to milligram. So gram is 1000, because 1 gram == 1000 milligrams.

    You can make any unit the base unit, but to me it is easier to think of the smallest unit as the base unit and make its multiplier by 1.

    Look again at the table:
    Code:
    var multipliers = {
        "mMilligram" : 1,
        "mGram" : 1000,
        "mKilogram" : 1000000,
        "avdpOunce" : 28349.523125,
        "avdpPound" : 16 * 28349.523125,
        "usTon" : 2000 * 16 * 28349.523125
    }
    The name in quotes needs to match one of the form field names and then the number is how many milligrams ther are in that unit.

    1000 milligrams in a gram. 28349.523125 milligrams in an ounce. And so on.

    To make it readable, I used multipliers for the avdp measures: I started with an ounce (28395.523125) and then simply multiplied by the appropriate number (16) to get a pound or (2000 pounds, 2000 * 16 ounces) to get a ton. Etc.

    Unless you have a good reason, leave the numbers I have there alone and just add more.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #15
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,210
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    If you used, say, ounce as the base weight, then you'd have something like this:

    Code:
    var multipliers = {
        "mMilligram" : 0.00003527396
        "mGram" : 0.03527396
        "mKilogram" : 35.27396
        "avdpOunce" : 1
        "avdpPound" : 16,
        "usTon" : 2000 * 16
    }
    I just think it's cleaner if all the numbers are 1 or greater.

    But it doesn't matter, so long as you are consistent.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

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