J'ai changé la valeur de l'étendue, j'ai donc besoin d'obtenir le total général pour l'étendue. J'ai donné aux champs de saisie un identifiant de division de niveau supérieur appelé "sumDiv" aussi mon Span a un attribut "name" comme celui-ci

var result = $("<span name='result'>"); 

La fonction pour calculer toute la durée est ci-dessous :

function getDivSum(selector) {
          var sum = 0;
          $(selector).each(function() {
            $(this`enter code here`).children("span").each(function() {
              sum += parseInt($(this).html());
            });
          });
          return sum;
        }
        $(document).ready(function() {
          console.log(getDivSum("#sumDiv"));
        });

J'obtiens des 0 pour le total général, qu'est-ce que je fais mal ? cela devrait obtenir toutes les valeurs de span

 $(this`enter code here`).children("span").each(function() {

Mais j'obtiens la valeur 0 sur le journal de la console.

A également essayé

$('.parent').each(function(){   
    var sum = 0;
    var counts = $(this).find('.count');

    counts.each(function() {
        sum+= parseInt($(this).text());
    });  
    console.log(sum);  
});

Ne pouvait pas le faire fonctionner.

Codepen : https://codepen.io/dunya/pen/MxXqrZ

Merci

function myLoad() {
        var apple   = 777777;
        var apricot   = 111111  ;
        var banana   = 222222  ;
        var bilberry   = 3333 ;
        var blackberry   = 3333  ;
        var blackcurrant   = 2222 ;
        var blueberry   = 88888 ;
        var boysenberry   = 8888888 ;
        var cherry   = 99999 ;
        var coconut = 99887 ;
    $("#Apple").value = apple;
    $("#Apricot").value = apricot;
    $("#Banana").value = banana;
    $("#Bilberry").value = bilberry;
    $("#Blackberry").value = blackberry;
    $("#Blackcurrant").value = blackcurrant;
    $("#Blueberry").value = blueberry;
    $("#Boysenberry").value = boysenberry;
    $("#Cherry").value = cherry;
    $("#Coconut").value = coconut;
}
function myCalculate(){
  var volume = $("#Volume").val();
  var productOrigin = $("#ProductOrigin").val();
  var geographicalLocation = $("#GeoLocation").val();
  
  if (volume === "" || productOrigin === "") {
		// alert("Please select the product origin and volume.");
		return;
	}
  
  var tableToUse = geographicalLocation === "" ? productOrigin : geographicalLocation;
  
  $("input[type='text']").each(function(i){
    
    // Current product ID, e.g. "Apple", "Apricot", etc.
	  var currentProductId = $(this).attr('id');
    
    // Amount to multiply.
    var multiplier = $(`table#${tableToUse} tbody > tr[product='${currentProductId}'] > td[volume='${volume}']`).text();
    
    // A <span> element, to be populated with the calculated product volume.
	var result = $("<span name='result'>");

	// Calculate the figure and update the result element.
	result.text($(this).val() * multiplier); 

	// Remove any previously added <span> result elements.
	$(this).next("span").remove();

	// Insert result after the current input field.
	$(this).after(result);
    
   
    // to calculate Grand total
        function getDivSum(selector) {
          var sum = 0;
          $(selector).each(function() {
            $(this).children("span").each(function() {
              sum += parseInt($(this).html());
            });
          });
          return sum;
        }
        $(document).ready(function() {
          console.log(getDivSum("#sumDiv"));
        });

  }); 
  
}



myLoad();

$('.select').on('change', myCalculate);
$("input[type='text']").on('keyup', myCalculate);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <label class="description" for="ProductOrigin">Product Origin</label>
  <select class="element select medium" id="ProductOrigin" name="ProductOrigin">
    <option value="" selected="selected"></option>
    <option value="Europe">Europe</option>
    <option value="Asia">Asia</option>
    <option value="China">China</option>
    <option value="India">India</option>
    <option value="USA">USA</option>
    <option value="Africa">Africa</option>
  </select>
</div>

<div>
  <label class="description" for="GeoLocation">Geographical Location</label>
  <select class="element select medium" id="GeoLocation" name="GeoLocation">
    <option value="" selected="selected"></option>
    <option value="England">England</option>
    <option value="Scotland">Scotland</option>
    <option value="Wales">Wales</option>
  </select>
</div>
<div>
  <label class="description" for="Volume">Volume</label>
  <select class="element select medium" id="Volume" name="Volume">
    <option value="" selected="selected"></option>
    <option value="10">10</option>
    <option value="100">100</option>
    <option value="1000">1000</option>
    <option value="2000">2000</option>
    <option value="3000">3000</option>
    <option value="4000">4000</option>
    <option value="5000">5000</option>
    <option value="6000">6000</option>
    <option value="6000">6000</option>
    <option value="8000">8000</option>
    <option value="9000">9000</option>
    <option value="10000">10000</option>
    <option value="20000">20000</option>
    <option value="30000">30000</option>
    <option value="40000">40000</option>
    <option value="50000">50000</option>
  </select>
</div>

<div id="sumDiv">
<div>
  <label class="description" for="Apple">Apple</label>
  <input id="Apple" name="Apple" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Apricot">Apricot</label>
  <input id="Apricot" name="Apricot" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Banana">Banana</label>
  <input id="Banana" name="Banana" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Bilberry">Bilberry</label>
  <input id="Bilberry" name="Bilberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true" />
</div>
<div>
  <label class="description" for="Blackberry">Blackberry</label>
  <input id="Blackberry" name="Blackberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Blackcurrant">Blackcurrant</label>
  <input id="Blackcurrant" name="Blackcurrant" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Blueberry">Blueberry</label>
  <input id="Blueberry" name="Blueberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Boysenberry">Boysenberry</label>
  <input id="Boysenberry" name="Boysenberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Cherry">Cherry</label>
  <input id="Cherry" name="Cherry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Coconut">Coconut</label>
  <input id="Coconut" name="Coconut" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>


<div>
  <label class="description" for="GrandTotal">Grand Total</label>
  <input id="GrandTotal" name="GrandTotal" class="element text medium" type="text" maxlength="255" value="" readonly="true"/>
</div>

</div>

<table id="Europe">
  <thead>Europe</thead>
  <tr>
    <td>Europe</td>
    <th id=10>10</th>
    <th id=100>100</th>
    <th id=1000>1000</th>
    <th id=2000>2000</th>
    <th id=3000>3000</th>
    <th id=4000>4000</th>
    <th id=5000>5000</th>
    <th id=6000>6000</th>
    <th id=7000>7000</th>
    <th id=8000>8000</th>
    <th id=9000>9000</th>
    <th id=10000>10000</th>
    <th id=20000>20000</th>
    <th id=30000>30000</th>
    <th id=40000>40000</th>
    <th id=50000>50000</th>
  </tr>
  <tbody>
    <tr product='Apple'>
      <td>Apple</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>3</td>
      <td volume='4000'>4</td>
      <td volume='5000'>5</td>
      <td volume='6000'>6</td>
      <td volume='7000'>7</td>
      <td volume='8000'>8</td>
      <td volume='9000'>9</td>
      <td volume='10000'>10</td>
      <td volume='20000'>11</td>
      <td volume='30000'>12</td>
      <td volume='40000'>13</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Apricot'>
      <td>Apricot</td>
      <td volume='10'>0</td>
      <td volume='100'>0</td>
      <td volume='1000'>0</td>
      <td volume='2000'>0.5</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1.5</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2.5</td>
      <td volume='7000'>3</td>
      <td volume='8000'>3.5</td>
      <td volume='9000'>4</td>
      <td volume='10000'>4.5</td>
      <td volume='20000'>5</td>
      <td volume='30000'>5.5</td>
      <td volume='40000'>6</td>
      <td volume='50000'>7</td>
    </tr>
    <tr product='Banana'>
      <td>Banana</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>5</td>
      <td volume='3000'>10</td>
      <td volume='4000'>15</td>
      <td volume='5000'>20</td>
      <td volume='6000'>25</td>
      <td volume='7000'>27</td>
      <td volume='8000'>30</td>
      <td volume='9000'>33</td>
      <td volume='10000'>36</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Bilberry'>
      <td>Bilberry</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>15</td>
      <td volume='3000'>20</td>
      <td volume='4000'>25</td>
      <td volume='5000'>30</td>
      <td volume='6000'>35</td>
      <td volume='7000'>40</td>
      <td volume='8000'>45</td>
      <td volume='9000'>50</td>
      <td volume='10000'>55</td>
      <td volume='20000'>60</td>
      <td volume='30000'>65</td>
      <td volume='40000'>70</td>
      <td volume='50000'>75</td>
    </tr>
    <tr product='Blackberry'>
      <td>Blackberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>50</td>
      <td volume='4000'>75</td>
      <td volume='5000'>100</td>
      <td volume='6000'>125</td>
      <td volume='7000'>150</td>
      <td volume='8000'>175</td>
      <td volume='9000'>200</td>
      <td volume='10000'>225</td>
      <td volume='20000'>250</td>
      <td volume='30000'>275</td>
      <td volume='40000'>300</td>
      <td volume='50000'>350</td>
    </tr>
    <tr product='Blackcurrant'>
      <td>Blackcurrant</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>2</td>
      <td volume='4000'>4</td>
      <td volume='5000'>4</td>
      <td volume='6000'>4</td>
      <td volume='7000'>6</td>
      <td volume='8000'>6</td>
      <td volume='9000'>6</td>
      <td volume='10000'>8</td>
      <td volume='20000'>8</td>
      <td volume='30000'>10</td>
      <td volume='40000'>12</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Blueberry'>
      <td>Blueberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>4</td>
      <td volume='3000'>6</td>
      <td volume='4000'>8</td>
      <td volume='5000'>10</td>
      <td volume='6000'>12</td>
      <td volume='7000'>14</td>
      <td volume='8000'>16</td>
      <td volume='9000'>18</td>
      <td volume='10000'>20</td>
      <td volume='20000'>24</td>
      <td volume='30000'>28</td>
      <td volume='40000'>30</td>
      <td volume='50000'>36</td>
    </tr>
    <tr product='Boysenberry'>
      <td>Boysenberry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>4</td>
      <td volume='3000'>5.5</td>
      <td volume='4000'>7</td>
      <td volume='5000'>8.5</td>
      <td volume='6000'>10</td>
      <td volume='7000'>11.5</td>
      <td volume='8000'>13</td>
      <td volume='9000'>14.5</td>
      <td volume='10000'>16</td>
      <td volume='20000'>17.5</td>
      <td volume='30000'>19</td>
      <td volume='40000'>20.5</td>
      <td volume='50000'>22</td>
    </tr>
    <tr product='Cherry'>
      <td>Cherry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>5</td>
      <td volume='3000'>8</td>
      <td volume='4000'>10</td>
      <td volume='5000'>15</td>
      <td volume='6000'>20</td>
      <td volume='7000'>25</td>
      <td volume='8000'>28</td>
      <td volume='9000'>31</td>
      <td volume='10000'>35</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Coconut'>
      <td>Coconut</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.25</td>
      <td volume='1000'>0.5</td>
      <td volume='2000'>0.5</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2</td>
      <td volume='7000'>2</td>
      <td volume='8000'>2</td>
      <td volume='9000'>2.5</td>
      <td volume='10000'>2.5</td>
      <td volume='20000'>3</td>
      <td volume='30000'>3</td>
      <td volume='40000'>3</td>
      <td volume='50000'>3</td>
    </tr>
  </tbody>
</table>

<table id="England">
  <thead>England</thead>
  <tr>
    <td>England</td>
    <th id=10>10</th>
    <th id=100>100</th>
    <th id=1000>1000</th>
    <th id=2000>2000</th>
    <th id=3000>3000</th>
    <th id=4000>4000</th>
    <th id=5000>5000</th>
    <th id=6000>6000</th>
    <th id=7000>7000</th>
    <th id=8000>8000</th>
    <th id=9000>9000</th>
    <th id=10000>10000</th>
    <th id=20000>20000</th>
    <th id=30000>30000</th>
    <th id=40000>40000</th>
    <th id=50000>50000</th>
  </tr>
  <tbody>
    <tr product='Apple'>
      <td>Apple</td>
      <td volume='10'>10</td>
      <td volume='100'>10</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>30</td>
      <td volume='4000'>40</td>
      <td volume='5000'>50</td>
      <td volume='6000'>60</td>
      <td volume='7000'>70</td>
      <td volume='8000'>80</td>
      <td volume='9000'>90</td>
      <td volume='10000'>100</td>
      <td volume='20000'>110</td>
      <td volume='30000'>120</td>
      <td volume='40000'>130</td>
      <td volume='50000'>140</td>
    </tr>
    <tr product='Apricot'>
      <td>Apricot</td>
      <td volume='10'>10</td>
      <td volume='100'>10</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>30</td>
      <td volume='4000'>40</td>
      <td volume='5000'>50</td>
      <td volume='6000'>60</td>
      <td volume='7000'>70</td>
      <td volume='8000'>80</td>
      <td volume='9000'>90</td>
      <td volume='10000'>100</td>
      <td volume='20000'>110</td>
      <td volume='30000'>120</td>
      <td volume='40000'>130</td>
      <td volume='50000'>140</td>
    </tr>
    <tr product='Banana'>
      <td>Banana</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>5</td>
      <td volume='3000'>10</td>
      <td volume='4000'>15</td>
      <td volume='5000'>20</td>
      <td volume='6000'>25</td>
      <td volume='7000'>27</td>
      <td volume='8000'>30</td>
      <td volume='9000'>33</td>
      <td volume='10000'>36</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Bilberry'>
      <td>Bilberry</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>15</td>
      <td volume='3000'>20</td>
      <td volume='4000'>25</td>
      <td volume='5000'>30</td>
      <td volume='6000'>35</td>
      <td volume='7000'>40</td>
      <td volume='8000'>45</td>
      <td volume='9000'>50</td>
      <td volume='10000'>55</td>
      <td volume='20000'>60</td>
      <td volume='30000'>65</td>
      <td volume='40000'>70</td>
      <td volume='50000'>75</td>
    </tr>
    <tr product='Blackberry'>
      <td>Blackberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>50</td>
      <td volume='4000'>75</td>
      <td volume='5000'>100</td>
      <td volume='6000'>125</td>
      <td volume='7000'>150</td>
      <td volume='8000'>175</td>
      <td volume='9000'>200</td>
      <td volume='10000'>225</td>
      <td volume='20000'>250</td>
      <td volume='30000'>275</td>
      <td volume='40000'>300</td>
      <td volume='50000'>350</td>
    </tr>
    <tr product='Blackcurrant'>
      <td>Blackcurrant</td>
      <td volume='10'>20</td>
      <td volume='100'>5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>2</td>
      <td volume='4000'>4</td>
      <td volume='5000'>4</td>
      <td volume='6000'>4</td>
      <td volume='7000'>6</td>
      <td volume='8000'>6</td>
      <td volume='9000'>6</td>
      <td volume='10000'>8</td>
      <td volume='20000'>8</td>
      <td volume='30000'>10</td>
      <td volume='40000'>12</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Blueberry'>
      <td>Blueberry</td>
      <td volume='10'>41</td>
      <td volume='100'>51</td>
      <td volume='1000'>1</td>
      <td volume='2000'>4</td>
      <td volume='3000'>6</td>
      <td volume='4000'>8</td>
      <td volume='5000'>10</td>
      <td volume='6000'>12</td>
      <td volume='7000'>14</td>
      <td volume='8000'>16</td>
      <td volume='9000'>18</td>
      <td volume='10000'>20</td>
      <td volume='20000'>24</td>
      <td volume='30000'>28</td>
      <td volume='40000'>30</td>
      <td volume='50000'>36</td>
    </tr>
    <tr product='Boysenberry'>
      <td>Boysenberry</td>
      <td volume='10'>500</td>
      <td volume='100'>10</td>
      <td volume='1000'>25</td>
      <td volume='2000'>4</td>
      <td volume='3000'>5</td>
      <td volume='4000'>7</td>
      <td volume='5000'>8</td>
      <td volume='6000'>10</td>
      <td volume='7000'>15</td>
      <td volume='8000'>13</td>
      <td volume='9000'>14</td>
      <td volume='10000'>16</td>
      <td volume='20000'>175</td>
      <td volume='30000'>19</td>
      <td volume='40000'>205</td>
      <td volume='50000'>22</td>
    </tr>
    <tr product='Cherry'>
      <td>Cherry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>5</td>
      <td volume='3000'>8</td>
      <td volume='4000'>10</td>
      <td volume='5000'>15</td>
      <td volume='6000'>20</td>
      <td volume='7000'>25</td>
      <td volume='8000'>28</td>
      <td volume='9000'>31</td>
      <td volume='10000'>35</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Coconut'>
      <td>Coconut</td>
      <td volume='10'>41</td>
      <td volume='100'>5</td>
      <td volume='1000'>115</td>
      <td volume='2000'>445</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2</td>
      <td volume='7000'>2</td>
      <td volume='8000'>2</td>
      <td volume='9000'>2</td>
      <td volume='10000'>14</td>
      <td volume='20000'>3</td>
      <td volume='30000'>3</td>
      <td volume='40000'>3</td>
      <td volume='50000'>3</td>
    </tr>
  </tbody>
</table>
<div class="">
    <table id="multiplierSemtricaValues">
        <thead><strong>multiplierSemtricaValues</strong></thead>
        <tr>
            <td><strong>multiplierSemtricaValues</strong></td>
            <td id="">Value to apply</td> 
        </tr>
        <tbody>
            <tr Semtrica='Apple'>
                <td>Apple</td>
                <td valueToCalc='Apple'>65</td>
            </tr>
            <tr Semtrica='Apricot'>
                <td>Apricot</td>
                <td valueToCalc='Apricot'>141</td>
            </tr>
            <tr Semtrica='Banana'>
                <td>Banana</td>
                <td valueToCalc='Banana'>100</td>
            </tr>
            <tr Semtrica='Bilberry'>
                <td>Bilberry</td>
                <td valueToCalc='Bilberry'>10.47</td>
            </tr>
            <tr Semtrica='Blackberry'>
                <td>Blackberry</td>
                <td valueToCalc='Blackberry'>312</td>
            </tr>
            <tr Semtrica='Blackcurrant'>
                <td>Blackcurrant</td>
                <td valueToCalc='Blackcurrant'>292</td>
            </tr>
            <tr Semtrica='Blueberry'>
                <td>Blueberry</td>
                <td valueToCalc='Blueberry'>32</td>
            </tr>
            <tr Semtrica='Boysenberry'>
                <td>Boysenberry</td>
                <td valueToCalc='Boysenberry'>50</td>
            </tr>
            <tr Semtrica='Cherry'>
                <td>Cherry</td>
                <td valueToCalc='Cherry'>100</td>
            </tr>
            <tr Semtrica='Cherry'>
                <td>Cherry</td>
                <td valueToCalc='Cherry'>50</td>
            </tr>
        </tbody>
    </table>
</div>
0
erkind dunya 18 mars 2019 à 20:00

2 réponses

Meilleure réponse

Dans le Codepen : https://codepen.io/dunya/pen/MxXqrZ changer cette ligne

$(this).children("span").each(function() {

Avec ça

$(this).children().children("span").each(function() {

Lien vers le stylo édité https://codepen.io/anon/pen/aMjoXy

0
scaff 18 mars 2019 à 17:53

Le problème avec votre journal de console est lorsque vous vous connectez.

Au document prêt, il n'y a pas de valeurs ou d'étendues, donc lorsque vous essayez d'obtenir les valeurs, vous allez juste obtenir des valeurs nulles qui se convertissent en 0 et votre résultat est 0.

Lorsque vous modifiez vos entrées, les champs se remplissent et votre gestionnaire s'exécute afin que vous obteniez les résultats à côté des zones de saisie. Votre code d'origine utilise .children sur le #sumDiv mais cela ne fonctionnera pas car les étendues ne sont pas des enfants de cette div.

J'ai changé ça en

$(this).find("span").each(function() {
    sum += parseInt($(this).html());
});

Enfin, votre total général est de 0, car ce champ n'a aucune valeur. Je viens donc de créer une ligne simple pour la mettre à jour

$("#GrandTotal").next().html(getDivSum("#sumDiv"))

Beaucoup de choses peuvent être optimisées, j'en suis sûr, mais c'est trop pour tout passer en revue. D'une part, vous exécutez une boucle sur chaque #sumDiv, ce qui ne devrait pas se produire car les identifiants doivent être uniques. Si vous avez plusieurs #sumDiv, vous devez utiliser une classe à la place et parcourir la classe

Voici le stylo que j'ai créé

https://codepen.io/anon/pen/pYZzEX

function myLoad() {
        var apple   = 777777;
        var apricot   = 111111  ;
        var banana   = 222222  ;
        var bilberry   = 3333 ;
        var blackberry   = 3333  ;
        var blackcurrant   = 2222 ;
        var blueberry   = 88888 ;
        var boysenberry   = 8888888 ;
        var cherry   = 99999 ;
        var coconut = 99887 ;
    $("#Apple").value = apple;
    $("#Apricot").value = apricot;
    $("#Banana").value = banana;
    $("#Bilberry").value = bilberry;
    $("#Blackberry").value = blackberry;
    $("#Blackcurrant").value = blackcurrant;
    $("#Blueberry").value = blueberry;
    $("#Boysenberry").value = boysenberry;
    $("#Cherry").value = cherry;
    $("#Coconut").value = coconut;
}
function myCalculate(){
  var volume = $("#Volume").val();
  var productOrigin = $("#ProductOrigin").val();
  var geographicalLocation = $("#GeoLocation").val();
  
  if (volume === "" || productOrigin === "") {
		// alert("Please select the product origin and volume.");
		return;
	}
  
  var tableToUse = geographicalLocation === "" ? productOrigin : geographicalLocation;
  
  $("input[type='text']").each(function(i){
    
    // Current product ID, e.g. "Apple", "Apricot", etc.
	  var currentProductId = $(this).attr('id');
    
    // Amount to multiply.
    var multiplier = $(`table#${tableToUse} tbody > tr[product='${currentProductId}'] > td[volume='${volume}']`).text();
    
    // A <span> element, to be populated with the calculated product volume.
	var result = $("<span name='result'>");

	// Calculate the figure and update the result element.
	result.text($(this).val() * multiplier); 

	// Remove any previously added <span> result elements.
	$(this).next("span").remove();

	// Insert result after the current input field.
	$(this).after(result);
    
   
    // to calculate Grand total
        function getDivSum(selector) {
          var sum = 0;
          $(selector).each(function() {
            $(this).find("span").each(function() {
              sum += parseInt($(this).html());
            });
          });
          return sum;
        }
    
    console.log(getDivSum("#sumDiv"))
    $("#GrandTotal").next().html(getDivSum("#sumDiv"))
    
        $(document).ready(function() {
          console.log(getDivSum("#sumDiv"));
        });

  }); 
  
}



myLoad();

$('.select').on('change', myCalculate);
$("input[type='text']").on('keyup', myCalculate);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <label class="description" for="ProductOrigin">Product Origin</label>
  <select class="element select medium" id="ProductOrigin" name="ProductOrigin">
    <option value="" selected="selected"></option>
    <option value="Europe">Europe</option>
    <option value="Asia">Asia</option>
    <option value="China">China</option>
    <option value="India">India</option>
    <option value="USA">USA</option>
    <option value="Africa">Africa</option>
  </select>
</div>

<div>
  <label class="description" for="GeoLocation">Geographical Location</label>
  <select class="element select medium" id="GeoLocation" name="GeoLocation">
    <option value="" selected="selected"></option>
    <option value="England">England</option>
    <option value="Scotland">Scotland</option>
    <option value="Wales">Wales</option>
  </select>
</div>
<div>
  <label class="description" for="Volume">Volume</label>
  <select class="element select medium" id="Volume" name="Volume">
    <option value="" selected="selected"></option>
    <option value="10">10</option>
    <option value="100">100</option>
    <option value="1000">1000</option>
    <option value="2000">2000</option>
    <option value="3000">3000</option>
    <option value="4000">4000</option>
    <option value="5000">5000</option>
    <option value="6000">6000</option>
    <option value="6000">6000</option>
    <option value="8000">8000</option>
    <option value="9000">9000</option>
    <option value="10000">10000</option>
    <option value="20000">20000</option>
    <option value="30000">30000</option>
    <option value="40000">40000</option>
    <option value="50000">50000</option>
  </select>
</div>

<div id="sumDiv">
<div>
  <label class="description" for="Apple">Apple</label>
  <input id="Apple" name="Apple" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Apricot">Apricot</label>
  <input id="Apricot" name="Apricot" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Banana">Banana</label>
  <input id="Banana" name="Banana" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Bilberry">Bilberry</label>
  <input id="Bilberry" name="Bilberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true" />
</div>
<div>
  <label class="description" for="Blackberry">Blackberry</label>
  <input id="Blackberry" name="Blackberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Blackcurrant">Blackcurrant</label>
  <input id="Blackcurrant" name="Blackcurrant" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Blueberry">Blueberry</label>
  <input id="Blueberry" name="Blueberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Boysenberry">Boysenberry</label>
  <input id="Boysenberry" name="Boysenberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Cherry">Cherry</label>
  <input id="Cherry" name="Cherry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
  <label class="description" for="Coconut">Coconut</label>
  <input id="Coconut" name="Coconut" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>


<div>
  <label class="description" for="GrandTotal">Grand Total</label>
  <input id="GrandTotal" name="GrandTotal" class="element text medium" type="text" maxlength="255" value="" readonly="true"/>
</div>

</div>

<table id="Europe">
  <thead>Europe</thead>
  <tr>
    <td>Europe</td>
    <th id=10>10</th>
    <th id=100>100</th>
    <th id=1000>1000</th>
    <th id=2000>2000</th>
    <th id=3000>3000</th>
    <th id=4000>4000</th>
    <th id=5000>5000</th>
    <th id=6000>6000</th>
    <th id=7000>7000</th>
    <th id=8000>8000</th>
    <th id=9000>9000</th>
    <th id=10000>10000</th>
    <th id=20000>20000</th>
    <th id=30000>30000</th>
    <th id=40000>40000</th>
    <th id=50000>50000</th>
  </tr>
  <tbody>
    <tr product='Apple'>
      <td>Apple</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>3</td>
      <td volume='4000'>4</td>
      <td volume='5000'>5</td>
      <td volume='6000'>6</td>
      <td volume='7000'>7</td>
      <td volume='8000'>8</td>
      <td volume='9000'>9</td>
      <td volume='10000'>10</td>
      <td volume='20000'>11</td>
      <td volume='30000'>12</td>
      <td volume='40000'>13</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Apricot'>
      <td>Apricot</td>
      <td volume='10'>0</td>
      <td volume='100'>0</td>
      <td volume='1000'>0</td>
      <td volume='2000'>0.5</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1.5</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2.5</td>
      <td volume='7000'>3</td>
      <td volume='8000'>3.5</td>
      <td volume='9000'>4</td>
      <td volume='10000'>4.5</td>
      <td volume='20000'>5</td>
      <td volume='30000'>5.5</td>
      <td volume='40000'>6</td>
      <td volume='50000'>7</td>
    </tr>
    <tr product='Banana'>
      <td>Banana</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>5</td>
      <td volume='3000'>10</td>
      <td volume='4000'>15</td>
      <td volume='5000'>20</td>
      <td volume='6000'>25</td>
      <td volume='7000'>27</td>
      <td volume='8000'>30</td>
      <td volume='9000'>33</td>
      <td volume='10000'>36</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Bilberry'>
      <td>Bilberry</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>15</td>
      <td volume='3000'>20</td>
      <td volume='4000'>25</td>
      <td volume='5000'>30</td>
      <td volume='6000'>35</td>
      <td volume='7000'>40</td>
      <td volume='8000'>45</td>
      <td volume='9000'>50</td>
      <td volume='10000'>55</td>
      <td volume='20000'>60</td>
      <td volume='30000'>65</td>
      <td volume='40000'>70</td>
      <td volume='50000'>75</td>
    </tr>
    <tr product='Blackberry'>
      <td>Blackberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>50</td>
      <td volume='4000'>75</td>
      <td volume='5000'>100</td>
      <td volume='6000'>125</td>
      <td volume='7000'>150</td>
      <td volume='8000'>175</td>
      <td volume='9000'>200</td>
      <td volume='10000'>225</td>
      <td volume='20000'>250</td>
      <td volume='30000'>275</td>
      <td volume='40000'>300</td>
      <td volume='50000'>350</td>
    </tr>
    <tr product='Blackcurrant'>
      <td>Blackcurrant</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>2</td>
      <td volume='4000'>4</td>
      <td volume='5000'>4</td>
      <td volume='6000'>4</td>
      <td volume='7000'>6</td>
      <td volume='8000'>6</td>
      <td volume='9000'>6</td>
      <td volume='10000'>8</td>
      <td volume='20000'>8</td>
      <td volume='30000'>10</td>
      <td volume='40000'>12</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Blueberry'>
      <td>Blueberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>4</td>
      <td volume='3000'>6</td>
      <td volume='4000'>8</td>
      <td volume='5000'>10</td>
      <td volume='6000'>12</td>
      <td volume='7000'>14</td>
      <td volume='8000'>16</td>
      <td volume='9000'>18</td>
      <td volume='10000'>20</td>
      <td volume='20000'>24</td>
      <td volume='30000'>28</td>
      <td volume='40000'>30</td>
      <td volume='50000'>36</td>
    </tr>
    <tr product='Boysenberry'>
      <td>Boysenberry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>4</td>
      <td volume='3000'>5.5</td>
      <td volume='4000'>7</td>
      <td volume='5000'>8.5</td>
      <td volume='6000'>10</td>
      <td volume='7000'>11.5</td>
      <td volume='8000'>13</td>
      <td volume='9000'>14.5</td>
      <td volume='10000'>16</td>
      <td volume='20000'>17.5</td>
      <td volume='30000'>19</td>
      <td volume='40000'>20.5</td>
      <td volume='50000'>22</td>
    </tr>
    <tr product='Cherry'>
      <td>Cherry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>5</td>
      <td volume='3000'>8</td>
      <td volume='4000'>10</td>
      <td volume='5000'>15</td>
      <td volume='6000'>20</td>
      <td volume='7000'>25</td>
      <td volume='8000'>28</td>
      <td volume='9000'>31</td>
      <td volume='10000'>35</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Coconut'>
      <td>Coconut</td>
      <td volume='10'>0.1</td>
      <td volume='100'>0.25</td>
      <td volume='1000'>0.5</td>
      <td volume='2000'>0.5</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2</td>
      <td volume='7000'>2</td>
      <td volume='8000'>2</td>
      <td volume='9000'>2.5</td>
      <td volume='10000'>2.5</td>
      <td volume='20000'>3</td>
      <td volume='30000'>3</td>
      <td volume='40000'>3</td>
      <td volume='50000'>3</td>
    </tr>
  </tbody>
</table>

<table id="England">
  <thead>England</thead>
  <tr>
    <td>England</td>
    <th id=10>10</th>
    <th id=100>100</th>
    <th id=1000>1000</th>
    <th id=2000>2000</th>
    <th id=3000>3000</th>
    <th id=4000>4000</th>
    <th id=5000>5000</th>
    <th id=6000>6000</th>
    <th id=7000>7000</th>
    <th id=8000>8000</th>
    <th id=9000>9000</th>
    <th id=10000>10000</th>
    <th id=20000>20000</th>
    <th id=30000>30000</th>
    <th id=40000>40000</th>
    <th id=50000>50000</th>
  </tr>
  <tbody>
    <tr product='Apple'>
      <td>Apple</td>
      <td volume='10'>10</td>
      <td volume='100'>10</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>30</td>
      <td volume='4000'>40</td>
      <td volume='5000'>50</td>
      <td volume='6000'>60</td>
      <td volume='7000'>70</td>
      <td volume='8000'>80</td>
      <td volume='9000'>90</td>
      <td volume='10000'>100</td>
      <td volume='20000'>110</td>
      <td volume='30000'>120</td>
      <td volume='40000'>130</td>
      <td volume='50000'>140</td>
    </tr>
    <tr product='Apricot'>
      <td>Apricot</td>
      <td volume='10'>10</td>
      <td volume='100'>10</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>30</td>
      <td volume='4000'>40</td>
      <td volume='5000'>50</td>
      <td volume='6000'>60</td>
      <td volume='7000'>70</td>
      <td volume='8000'>80</td>
      <td volume='9000'>90</td>
      <td volume='10000'>100</td>
      <td volume='20000'>110</td>
      <td volume='30000'>120</td>
      <td volume='40000'>130</td>
      <td volume='50000'>140</td>
    </tr>
    <tr product='Banana'>
      <td>Banana</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>5</td>
      <td volume='3000'>10</td>
      <td volume='4000'>15</td>
      <td volume='5000'>20</td>
      <td volume='6000'>25</td>
      <td volume='7000'>27</td>
      <td volume='8000'>30</td>
      <td volume='9000'>33</td>
      <td volume='10000'>36</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Bilberry'>
      <td>Bilberry</td>
      <td volume='10'>1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>15</td>
      <td volume='3000'>20</td>
      <td volume='4000'>25</td>
      <td volume='5000'>30</td>
      <td volume='6000'>35</td>
      <td volume='7000'>40</td>
      <td volume='8000'>45</td>
      <td volume='9000'>50</td>
      <td volume='10000'>55</td>
      <td volume='20000'>60</td>
      <td volume='30000'>65</td>
      <td volume='40000'>70</td>
      <td volume='50000'>75</td>
    </tr>
    <tr product='Blackberry'>
      <td>Blackberry</td>
      <td volume='10'>0.1</td>
      <td volume='100'>5</td>
      <td volume='1000'>10</td>
      <td volume='2000'>20</td>
      <td volume='3000'>50</td>
      <td volume='4000'>75</td>
      <td volume='5000'>100</td>
      <td volume='6000'>125</td>
      <td volume='7000'>150</td>
      <td volume='8000'>175</td>
      <td volume='9000'>200</td>
      <td volume='10000'>225</td>
      <td volume='20000'>250</td>
      <td volume='30000'>275</td>
      <td volume='40000'>300</td>
      <td volume='50000'>350</td>
    </tr>
    <tr product='Blackcurrant'>
      <td>Blackcurrant</td>
      <td volume='10'>20</td>
      <td volume='100'>5</td>
      <td volume='1000'>1</td>
      <td volume='2000'>2</td>
      <td volume='3000'>2</td>
      <td volume='4000'>4</td>
      <td volume='5000'>4</td>
      <td volume='6000'>4</td>
      <td volume='7000'>6</td>
      <td volume='8000'>6</td>
      <td volume='9000'>6</td>
      <td volume='10000'>8</td>
      <td volume='20000'>8</td>
      <td volume='30000'>10</td>
      <td volume='40000'>12</td>
      <td volume='50000'>14</td>
    </tr>
    <tr product='Blueberry'>
      <td>Blueberry</td>
      <td volume='10'>41</td>
      <td volume='100'>51</td>
      <td volume='1000'>1</td>
      <td volume='2000'>4</td>
      <td volume='3000'>6</td>
      <td volume='4000'>8</td>
      <td volume='5000'>10</td>
      <td volume='6000'>12</td>
      <td volume='7000'>14</td>
      <td volume='8000'>16</td>
      <td volume='9000'>18</td>
      <td volume='10000'>20</td>
      <td volume='20000'>24</td>
      <td volume='30000'>28</td>
      <td volume='40000'>30</td>
      <td volume='50000'>36</td>
    </tr>
    <tr product='Boysenberry'>
      <td>Boysenberry</td>
      <td volume='10'>500</td>
      <td volume='100'>10</td>
      <td volume='1000'>25</td>
      <td volume='2000'>4</td>
      <td volume='3000'>5</td>
      <td volume='4000'>7</td>
      <td volume='5000'>8</td>
      <td volume='6000'>10</td>
      <td volume='7000'>15</td>
      <td volume='8000'>13</td>
      <td volume='9000'>14</td>
      <td volume='10000'>16</td>
      <td volume='20000'>175</td>
      <td volume='30000'>19</td>
      <td volume='40000'>205</td>
      <td volume='50000'>22</td>
    </tr>
    <tr product='Cherry'>
      <td>Cherry</td>
      <td volume='10'>0.5</td>
      <td volume='100'>1</td>
      <td volume='1000'>2.5</td>
      <td volume='2000'>5</td>
      <td volume='3000'>8</td>
      <td volume='4000'>10</td>
      <td volume='5000'>15</td>
      <td volume='6000'>20</td>
      <td volume='7000'>25</td>
      <td volume='8000'>28</td>
      <td volume='9000'>31</td>
      <td volume='10000'>35</td>
      <td volume='20000'>40</td>
      <td volume='30000'>45</td>
      <td volume='40000'>50</td>
      <td volume='50000'>55</td>
    </tr>
    <tr product='Coconut'>
      <td>Coconut</td>
      <td volume='10'>41</td>
      <td volume='100'>5</td>
      <td volume='1000'>115</td>
      <td volume='2000'>445</td>
      <td volume='3000'>1</td>
      <td volume='4000'>1</td>
      <td volume='5000'>2</td>
      <td volume='6000'>2</td>
      <td volume='7000'>2</td>
      <td volume='8000'>2</td>
      <td volume='9000'>2</td>
      <td volume='10000'>14</td>
      <td volume='20000'>3</td>
      <td volume='30000'>3</td>
      <td volume='40000'>3</td>
      <td volume='50000'>3</td>
    </tr>
  </tbody>
</table>
<div class="">
    <table id="multiplierSemtricaValues">
        <thead><strong>multiplierSemtricaValues</strong></thead>
        <tr>
            <td><strong>multiplierSemtricaValues</strong></td>
            <td id="">Value to apply</td> 
        </tr>
        <tbody>
            <tr Semtrica='Apple'>
                <td>Apple</td>
                <td valueToCalc='Apple'>65</td>
            </tr>
            <tr Semtrica='Apricot'>
                <td>Apricot</td>
                <td valueToCalc='Apricot'>141</td>
            </tr>
            <tr Semtrica='Banana'>
                <td>Banana</td>
                <td valueToCalc='Banana'>100</td>
            </tr>
            <tr Semtrica='Bilberry'>
                <td>Bilberry</td>
                <td valueToCalc='Bilberry'>10.47</td>
            </tr>
            <tr Semtrica='Blackberry'>
                <td>Blackberry</td>
                <td valueToCalc='Blackberry'>312</td>
            </tr>
            <tr Semtrica='Blackcurrant'>
                <td>Blackcurrant</td>
                <td valueToCalc='Blackcurrant'>292</td>
            </tr>
            <tr Semtrica='Blueberry'>
                <td>Blueberry</td>
                <td valueToCalc='Blueberry'>32</td>
            </tr>
            <tr Semtrica='Boysenberry'>
                <td>Boysenberry</td>
                <td valueToCalc='Boysenberry'>50</td>
            </tr>
            <tr Semtrica='Cherry'>
                <td>Cherry</td>
                <td valueToCalc='Cherry'>100</td>
            </tr>
            <tr Semtrica='Cherry'>
                <td>Cherry</td>
                <td valueToCalc='Cherry'>50</td>
            </tr>
        </tbody>
    </table>
</div>
0
Huangism 18 mars 2019 à 17:43