change-type-calc

by Rey Den Nalasa

HTML

<div id="wpc_total"></div>

<select name="service_type" id="service_type" required="">
  <option value="">-- Select One --</option>
  <option value="Express Delivery">Express Delivery</option>
  <option value="Economy Delivery">Economy Delivery</option>
</select>

<table>
  <tbody data-repeater-list="pq_package_items">
    <tr data-repeater-item>
      <td>
        <input class="number" type='text' name="qty" required="required" />
      </td>
      <td>
        <select name="piece_type" required="required">
          <option value="">Select Type</option>
          <option value="Documents (Up to 1kg)">Documents (Up to 1kg)</option>
          <option value="Small (1-5kg 85cm)">Small (1-5kg 85cm)</option>
          <option value="Medium (5-10kg 110cm)">Medium (5-10kg 110cm)</option>
        </select>
      </td>
      <td>
        <span name="wpc_subtotal">Subtotal </span>
      </td>
    </tr>
    <tr data-repeater-item>
      <td>
        <input class="number" type='text' name="qty" required="required" />
      </td>
      <td>
        <select name="piece_type" required="required">
          <option value="">Select Type</option>
          <option value="Documents (Up to 1kg)">Documents (Up to 1kg)</option>
          <option value="Small (1-5kg 85cm)">Small (1-5kg 85cm)</option>
          <option value="Medium (5-10kg 110cm)">Medium (5-10kg 110cm)</option>
        </select>
      </td>
      <td>
        <span name="wpc_subtotal">Subtotal </span>
      </td>
    </tr>
    <tr data-repeater-item>
      <td>
        <input class="number" type='text' name="qty" required="required" />
      </td>
      <td>
        <select name="piece_type" required="required">
          <option value="">Select Type</option>
          <option value="Documents (Up to 1kg)">Documents (Up to 1kg)</option>
          <option value="Small (1-5kg 85cm)">Small (1-5kg 85cm)</option>
          <option value="Medium (5-10kg 110cm)">Medium (5-10kg 110cm)</option>
        </select>
      </td>
  ...

JavaScript

jQuery(document).ready(function($) {

    function reset_table() {
         $('tr').each(function() {
         
         		var piece_type_value     =       0;
            var qty                  =       $(this).find("input[name*='qty']").val();
            var piece_type           =       $(this).find("select[name*='piece_type']").val();
            
            if(piece_type == "Medium (5-10kg 110cm)")
            {
            	 piece_type_value = 10
            }
            
            var recalc_total = (qty * piece_type_value);
            
            //$(this).find('span').text(recalc_total);
            $(this).find('span').text(recalc_total)
        }); //END .each
    }
    $("#service_type").change(reset_table);


  });