Hi,

I am a complete begineer in relation to js and jquery, and am attempting to modify an existing order form script from;

Site: http://dabrook.org/blog/articles/jquery-automatic-update-order-form-with-radio-buttons-and-checkboxes/
Page: http://dabrook.org/examples/cdia/javascript/05/form.html

Currently the order form script only supports check boxes and radio buttons, but i am trying to update it to also support drop down lists and then only form elements with a specific id.

Is this possible with jquery?

Many thanks in advance!

1. ORIGINAL CODE:
   // JavaScript Document
   
   $(document).ready(function()
   {    
       var total = 0;
       
   function calcTotal()
   {
       $("input:checked").each(function()
       {
           //This happens for each checked input field
           var value = $(this).attr("value");
           total += parseInt(value); //total = total + value            
          });
   }
    
       //This happens when the page loads
       calcTotal();    
       $("form").before('<p class="total">Total: <strong>' + total + '</strong></p>');
       $(":submit").before('<p class="total">Total: <strong>' + total + '</strong></p>');
           
       $("input:checkbox, input:radio").click(function()
       {
           total = 0;
           calcTotal();
           $("p.total").html("Total: <strong>" + total + "</strong>");
       });
   });
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   

1. ORDER FORM HTML TO SUPPORT AS EXAMPLE;
   <div class="packages1">
   <form action="" method="post">
       <fieldset id="packages1">
           <legend>Packages1</legend>
                   <input id="selectList" name="package1" type="radio" value="99" checked />
                   <label for="package1_basic">Basic: This package is aight. ($99)</label>
                 <input id="selectList" type="radio" name="package1" value="149" />
                 <label for="package1_pro">Professional: This package straight rocks. ($149)</label>
       </fieldset>
   
       <fieldset id="browser_support1">
           <legend>Browser Support</legend>   
               <input id="selectList" type="checkbox" name="browser1" value="100" />
               <label for="browser1">Will work in IE 12 ($100)</label>
       </fieldset>
      
       <fieldset>
           <legend>Packages1 Options</legend>       
       <select id="selectList" name="packages1_options" size="1">
     <option value="0" selected="selected">Choose</option>
     <option value="10">Option 1</option>
     <option value="20">Option 2</option>
     <option value="30">Option 3</option>
       </select>   
   </fieldset>
   </form>
   </div>