www.webdeveloper.com
Results 1 to 3 of 3

Thread: Need help to calculate total amount based selection options in form

  1. #1
    Join Date
    Jun 2014
    Posts
    1

    Post Need help to calculate total amount based selection options in form

    HI

    I am new to Javascript and struck up in middle of my assignment.
    I have developed a html page which contains a form of radio buttons,drop down list and check box and now i want a function when click on calculate button should update the total amount field text box based on the selection of radio buttons(type of item),drop down list(quality of image) and check box(glossy finish,if it is selected $1 is added if not no value) and quantity value.

    type of item
    quality of images hard copy poster coffeemug t-shirt
    good 5.99 6.99 7.99 8.99
    very good 6.99 7.99 8.99 9.99
    excellent 7.99 8.99 9.99 10.99


    Here is my code:
    html
    <form id="orderform" name="orderform">
    <!--Order form--
    Types of items
    <input type="radio" id="items" name="items" value="1" onclick="orderReady(this.value)">Hard-copy Prints
    <input type="radio" id="items" name="items" value="1" onclick="orderReady(this.value)">Posters
    <input type="radio" id="items" name="items" value="2" onclick="orderReady(this.value)">Coffee Mugs
    <input type="radio" id="items" name="items" value="3" onclick="orderReady(this.value)">T-shirts
    Quality of Images
    <select name="QualityofImages" id="quality">
    <option value="11" selected>Good</option>
    <option value="21">Very Good</option>
    <option value="31">Excellent</option>
    </select>
    Glossy finish
    <input type="checkbox" name="gf" id="gf">
    Quantity
    <input type="text" id ="qty" name="qty" size="5">
    <input type="button" id="calculate" value="Calculate">
    Total amount
    <input type="text" id="cost" name="cost" readonly="readonly">

    Note:function orderReady(this.value) which i am using is to calculate the order date based on selected item which is working fine


    Thanks
    vish

  2. #2
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,346
    Ok, so where is your JavaScript?
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  3. #3
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,346
    Ok, I just spent 30 minutes fiddling around and decided that you would be better off using a data object to hoe the types of merchandise and the costs of the various elements of your assignment.

    I also decided on setting up your form so that it not only removes any initial start up problems by ensuring that the radio and select elements have initial selected elements but also set the input quantity box to have an initial value of 1

    The form I designed calculates the value of the order based on the selection and the names of the fields helps with drawing data from the data object that stores the merchandise types and arrays of the values of the merchandise cost.

    To give you a taster...
    Code:
    data = {
    	merchandise:{
    				"hardcopy":0,	
    				"posters":1,	
    				...	
    				...	
    				},
    	quality:{
    			"good":[5.99,6.99,7.99,8.99],
    				...	
    				...
    				}
    }
    then ...
    HTML Code:
    <!--Order form-->
    		Types of items
    	<input name="merchandise" type="radio" value="hardcopy" checked>
    Hard-copy Prints
    		<input type="radio" name="merchandise" value="posters">
    Posters
    ....
    ....
    
    <select name="quality">
       	  <option value="good" selected>Good</option>
    ....
    ....
    You didn't say if glossy finish is $1 extra per print or just an extra $1 on top of the order quantity value so in my script it is calculated as $1 for each copy wanted.

    Then a short 9 line function is used to access form data, pull values from the data object and output a price.

    IMHO this would be a simpler method as it is easily edited.

    If you want to post up your answer, I can give you some pointers on how you can amend your script, I am not going to do homework, it is for you to do and learn from the advice given and you will need to experiment yourself with your ideas as you will have to be able to explain what is going on in your script if the teacher asks you about the script.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles