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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Sep 2012
    Posts
    7
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Class Assignment Help

    I have a javascript mini project for class, and I am lost. It's a beginning scripting class.

    The assignment is as follows:
    Create a webpage that will convert your favorite recipe.
    You can create an input box that will get a “conversion factor” then display the new list of measurements.
    For example:
    Omelet – 3 eggs
    2 tablespoons milk
    2 oz. Cheese
    If I wanted to double the recipe
    Omelet - 6 eggs
    4 tablespoons milk
    4 oz. Cheese

    The menu is easy, but I'm having trouble with the functions. I think using the Onchange function would be the way to go, but I don't know how to approach the problem seeing as how we haven't even learned functions yet, and my professor isn't the most helpful.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,537
    Thanks
    77
    Thanked 4,381 Times in 4,346 Posts
    Yes, you can do exactly that.

    Don't worry too much about the fact that it's going to be a function, since you only have to call it from the one place (e.g., <input name="factor" onchange="convert(this.value);"/>

    And then you just need
    Code:
    <script type="text/javascript">
    function convert( multiplier )
    {
        var eggs = 3 * multiplier;
        var milk = 2 * multiplier;
        ... etc. ...
    }
    </script>
    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:

    tbmtbm (10-03-2012)

  • #3
    New to the CF scene
    Join Date
    Oct 2012
    Posts
    9
    Thanks
    0
    Thanked 4 Times in 4 Posts
    There are many ways to solve this problem. But first you need to define how you will go about handing this issue.

    1. Display your base recipe with a way to get to the quantity values (to update) and a way to get the original quantities.
    2. Have a way to change the conversion factor. When the factor is changed have an event fire (onchange of the text box, onclick of a button, onsubmit of a form).
    3. Catch the event and get the new conversion factor, multiple the factor by the original quantities and update your recipe table.

    You should probably keep track of the original values somewhere. You need a way to either reference where the new quantities will update (placing them in a <div> and give the div an id and use document.getElementById('theid').innerHTML = newValue; to set the new values. Or you can create a function to dynamically recreate the table when the conversion factor has been changed.

    Good Luck

  • Users who have thanked slickuser for this post:

    tbmtbm (10-03-2012)


  •  

    Posting Permissions

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