Get the Sum of Lowest Values In 3 Columns Each added dynamically

Question

i am having a trouble having the sum of 3 lowest values entered in columns added dynamically. it shows no value in the Total Cost Field, although if i changed the type from number to text of Total Cost Field. It gives NaN into it. I have tried a lot but did not get on the final step. Please look into, i really can use some help in this regard

//JS To Add Rows Dynamically
$(document).ready(function() {
  var i = 1;
  $("#Add_BDSP").click(function() {
    $('#BDSP' + i).html("<td><select class='form-control show-tick form-group form-float' name='RequiredServices[" + i + "]' id='Services'><optgroup label=' financial services'><option id='AccountingSoftware' value='ERP Systems'>ERP Systems</option> <option id='AccountingSystems' value='Accounting Book Keeping Systems'>Accounting / Book Keeping Systems</option><option id='ProductCosting' value='Product Costing'>Product Costing</option><option id='FinancialManagement' value='Financial Management Systems'>Financial Management Systems</option></optgroup><optgroup label='HR Services'><option id='HRPolicies' value='HR Policies and Procedures'>HR Policies and Procedures</option><option id='HR_System' value='HR_System'>HR Systems</option><option id='Appraisal' value='Appraisal'>Employee Internal Trainings Manuals</option><option id='SalesManagement' value='SalesManagement'>sEmployee Orientation Manuals.</option> </optgroup><optgroup label='General Management'><option id='Project' value='ProjectManagement'>Project Management System</option><option id='Inventory' value='Inventory Management Systems'>Inventory Management Systems</option><option id='Warehouse' value='Warehouse'>Procurement System</option><option id='SupplyChain' value='SupplyChain'>Supply Chain Systems</option><option id='FleetManagement' value='Fleet Management Systems'>Fleet Management Systems</option></optgroup><optgroup label='Regulatory Services'><option id='Sales_Income_Tax' value='Sales_Income_Tax'>sales / Income Tax Services</option><option id='TradeMark' value='TradeMark'>Intellectual Property Rights</option><option id='BusinessRegistration' value='BusinessRegistration'>Business Registration Services</option><option id='B2B' value='B2B'>B2B, B2C Contracting Services</option><option id='BusinessLicensing' value='BusinessLicensing'>Business Licensing Services</option></optgroup><optgroup label='Production Management'><option id='ProductionPlanning' value='ProductionPlanning'>Production Planning & Control Systems</option><option id='ProductionManagement' value='ProductionManagement'>Warehouse Management Information Systems (WMIS)</option> </optgroup></select> </td><td><div class='input-group form-group form-float'><div class='form-line'><input type='text' name='Description[" + i + "]' ></div></div></td><td><input type='text' name='BDSPName1[" + i + "]' placeholder='BDSP Name'class='form-control' required /><input type='text' name='BDSPName2[" + i + "]' placeholder='BDSP Name'class='form-control'  /><input type='text' name='BDSPName3[" + i + "]' placeholder='BDSP Name'class='form-control'  /></td> <td><input type='text' name='BDSP_NTN1[" + i + "]'placeholder='BDSP NTN Number' class='form-control'/><input type='text' name='BDSP_NTN2[" + i + "]'placeholder='BDSP NTN Number' class='form-control' /><input type='text' name='BDSP_NTN3[" + i + "]'placeholder='BDSP NTN Number' class='form-control' /></td><td><input type='text' name='QuotedAmount1[" + i + "]' placeholder='Quoted Amount' class='form-control' /><input type='text' name='QuotedAmount2[" + i + "]'placeholder='Quoted Amount' class='form-control' /><input type='text' name='QuotedAmount3[" + i + "]' placeholder='Quoted Amount' class='form-control'/> </td><td><select class='form-group form-control' name='ExpectedDeliveryTime1[" + i + "]' id='ExpectedDeliveryTime1[0]'><option selected disabled>Select Days</option><option value='30' class='form-control input-md'>30</option><option value='60' class='form-control input-md'>60</option><option value='90' class='form-control input-md'>90</option><option value='120' class='form-control input-md'>120</option><option value='150' class='form-control input-md'>150</option><option value='180' class='form-control input-md'>180</option><option value='more180' class='form-control input-md'>More Than 180</option></select><select class='form-group form-control' name='ExpectedDeliveryTime2[" + i + "]' id='ExpectedDeliveryTime2[0]'><option selected disabled>Select Days</option><option value='30' class='form-control input-md'>30</option><option value='60' class='form-control input-md'>60</option><option value='90' class='form-control input-md'>90</option><option value='120' class='form-control input-md'>120</option><option value='150' class='form-control input-md'>150</option><option value='180' class='form-control input-md'>180</option><option value='more180' class='form-control input-md'>More Than 180</option></select><select class='form-group form-control' name='ExpectedDeliveryTime3[" + i + "]' id='ExpectedDeliveryTime3[0]'><option selected disabled>Select Days</option><option value='30' class='form-control input-md'>30</option><option value='60' class='form-control input-md'>60</option><option value='90' class='form-control input-md'>90</option><option value='120' class='form-control input-md'>120</option><option value='150' class='form-control input-md'>150</option><option value='180' class='form-control input-md'>180</option><option value='more180' class='form-control input-md'>More Than 180</option></select></td><td><input type='file' name='Quotation1[" + i + "]' class='form-control' /><input type='file' name='Quotation2[" + i + "]' class='form-control' /><input type='file' name='Quotation3[" + i + "]' class='form-control' /></td>");

    $('#Tab_BDSP').append('<tr id="BDSP' + (i + 1) + '"></tr>');
    i++;
  });
  $("#Delete_BDSP").click(function() {
    if (i > 1) {
      $("#BDSP" + (i - 1)).html('');
      i--;
    }
  });

});

//JS To Add Lowest Value

$(document).on('change', '#Tab_BDSP tbody tr td input[type="text"]', function() {
  let result = 0;
  var MulRes = $('input#ServiceTotalCost');

  var QuotedAmount1 = $(this).parent().find('input[type="text"]').eq(0),
    QuotedAmount2 = $(this).parent().find('input[type="text"]').eq(1),
    QuotedAmount3 = $(this).parent().find('input[type="text"]').eq(2);

  var Qoute1 = (isNaN(parseInt(QuotedAmount1.val()))) ? 0 : parseInt(QuotedAmount1.val()),
    Qoute2 = (isNaN(parseInt(QuotedAmount2.val()))) ? 0 : parseInt(QuotedAmount2.val()),
    Qoute3 = (isNaN(parseInt(QuotedAmount3.val()))) ? 0 : parseInt(QuotedAmount3.val());

  var min = Math.min(Qoute1, Qoute2, Qoute3);
  $(this).parent().attr('data-lowest', min)


  $('#Tab_BDSP tbody tr td').each(function() {
    result += +$(this).attr('data-lowest')
  });

  MulRes.val(result)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-md-12">
  <p>
    <b>Please Provide At Least 3 BDSPs Quotations Against Each Service</b> <span style="color: red">*</span>
  </p>
  <div class="form-group form-float">
    <table class="table table-bordered table-hover" id="Tab_BDSP">
      <thead>
        <tr>
          <td>Services Required</td>
          <td>Description</td>
          <td>BDSP Name</td>
          <td>NTN No.</td>
          <td>Amount</td>
          <td>Expected Delivery Time</td>
          <td>Attach Quotation</td>
        </tr>
      </thead>
      <tbody>
        <tr id='BDSP0'>
          <td>
            <select class="form-control show-tick form-group form-float" name="RequiredServices[0]" id="Services" required>
              <optgroup label="Financial Services">
                <option id="AccountingSoftware" value="ERP Systems">ERP Systems</option>
                <option id="AccountingSystems" value="Accounting Book Keeping Systems">Accounting / Book Keeping Systems</option>
                <option id="ProductCosting" value="Product Costing">Product Costing</option>
                <option id="FinancialManagement" value="Financial Management Systems">Financial Management Systems</option>

              </optgroup>

              <optgroup label="HR Services">
                <option id="HRPolicies" value="HR Policies and Procedures">HR Policies and Procedures</option>
                <option id="HR_System" value="HR_System">HR Systems</option>
                <option id="Appraisal" value="Appraisal">Employee Internal Trainings Manuals</option>
                <option id="SalesManagement" value="SalesManagement">sEmployee Orientation Manuals.</option>

              </optgroup>

              <optgroup label="General Management">
                <option id="Project" value="ProjectManagement">Project Management System</option>
                <option id="Inventory" value="Inventory Management Systems">Inventory Management Systems</option>
                <option id="Warehouse" value="Warehouse">Procurement System</option>
                <option id="SupplyChain" value="SupplyChain">Supply Chain Systems</option>
                <option id="FleetManagement" value="Fleet Management Systems">Fleet Management Systems</option>

              </optgroup>

              <optgroup label="Regulatory Services">
                <option id="Sales_Income_Tax" value="Sales_Income_Tax">sales / Income Tax Services</option>
                <option id="TradeMark" value="TradeMark">Intellectual Property Rights</option>
                <option id="BusinessRegistration" value="BusinessRegistration">Business Registration Services</option>
                <option id="B2B" value="B2B">B2B, B2C Contracting Services</option>
                <option id="BusinessLicensing" value="BusinessLicensing">Business Licensing Services</option>

              </optgroup>

              <optgroup label="Production Management">
                <option id="ProductionPlanning" value="ProductionPlanning">Production Planning & Control Systems</option>
                <option id="ProductionManagement" value="ProductionManagement">Warehouse Management Information Systems (WMIS)</option>

              </optgroup>
              <optgroup label="Other Services">
                <option id="Other" value="OtherServices">Mention Other Services</option>

              </optgroup>


            </select>
          </td>
          <td>
            <div class="input-group form-group">

              <div class="form-line">
                <input type="text" class="form-control" name="Description[0]" id="Description" required>
              </div>
            </div>

          </td>
          <td>
            <input type="text" name='BDSPName1[0]' placeholder='BDSP Name' class="form-control" required />
            <input type="text" name='BDSPName2[0]' placeholder='BDSP Name' class="form-control" required />
            <input type="text" name='BDSPName3[0]' placeholder='BDSP Name' class="form-control" required />
          </td>

          <td>
            <input type="text" name='BDSP_NTN1[0]' placeholder='BDSP NTN Number' class="form-control" required />
            <input type="text" name='BDSP_NTN2[0]' placeholder='BDSP NTN Number' class="form-control" required />
            <input type="text" name='BDSP_NTN3[0]' placeholder='BDSP NTN Number' class="form-control" required />
          </td>


          <td>
            <input type="text" name='QuotedAmount1[0]' placeholder='Quoted Amount' class="form-control" required />
            <input type="text" name='QuotedAmount2[0]' placeholder='Quoted Amount' class="form-control" required />
            <input type="text" name='QuotedAmount3[0]' placeholder='Quoted Amount' class="form-control" required />
          </td>
          <td>
            <select class="form-group form-control" name="ExpectedDeliveryTime1[0]" id="ExpectedDeliveryTime1[0]" required>
              <option selected disabled>Select Days</option>
              <option value="AJK" class='form-control input-md'>30</option>
              <option value="Balochistan" class='form-control input-md'>60</option>
              <option value="GB" class='form-control input-md'>90</option>
              <option value="ICT" class='form-control input-md'>120</option>
              <option value="KPK" class='form-control input-md'>150</option>
              <option value="Punjab" class='form-control input-md'>180</option>
              <option value="Sindh" class='form-control input-md'>More Than 180</option>
            </select>
            <select class="form-group form-control" name="ExpectedDeliveryTime2[0]" id="ExpectedDeliveryTime2[0]" required>
              <option selected disabled>Select Days</option>
              <option value="AJK" class='form-control input-md'>30</option>
              <option value="Balochistan" class='form-control input-md'>60</option>
              <option value="GB" class='form-control input-md'>90</option>
              <option value="ICT" class='form-control input-md'>120</option>
              <option value="KPK" class='form-control input-md'>150</option>
              <option value="Punjab" class='form-control input-md'>180</option>
              <option value="Sindh" class='form-control input-md'>More Than 180</option>
            </select>
            <select class="form-group form-control" name="ExpectedDeliveryTime3[0]" id="ExpectedDeliveryTime3[0]" required>
              <option selected disabled>Select Days</option>
              <option value="AJK" class='form-control input-md'>30</option>
              <option value="Balochistan" class='form-control input-md'>60</option>
              <option value="GB" class='form-control input-md'>90</option>
              <option value="ICT" class='form-control input-md'>120</option>
              <option value="KPK" class='form-control input-md'>150</option>
              <option value="Punjab" class='form-control input-md'>180</option>
              <option value="Sindh" class='form-control input-md'>More Than 180</option>
            </select>
          </td>
          <td>
            <input type="file" name="Quotation1[0]" class="form-control" required />
            <input type="file" name="Quotation2[0]" class="form-control" required />
            <input type="file" name="Quotation3[0]" class="form-control" required />
          </td>
        </tr>

        <tr id='BDSP1'></tr>
      </tbody>
    </table>
  </div>
  <a id="Add_BDSP" class="btn btn-default pull-left">Add Row</a><a id='Delete_BDSP' class="pull-right btn btn-default">Delete Row</a>
</div>
<div class="col-md-4">
  <p>
    <b>Total Cost Of The Service</b> <span style="color: red">*</span>
  </p>
  <div class="input-group form-group">
    <span class="input-group-addon">
 <i class="material-icons">business_center</i></span>
    <div class="form-line">
      <input type="number" class="form-control" name="ServiceTotalCost" id="ServiceTotalCost" required>
    </div>
  </div>
</div>

Answer 1

You are running the function and looping through textboxes in all columns, which is causing you to get bad values. You need to check only the amount textboxes.

Add a class and a starting value for data-lowest to the Amount td:

<td data-lowest="0" class="amountTD">...</td>

Add the class to the jQuery event:

 jQuery( document ).on( 'change', '#Tab_BDSP tbody tr td.amountTD input[type="text"]', function ()

And add it to the loop like so, and wrap result in parseInt:

  jQuery( '#Tab_BDSP tbody tr td.amountTD' ).each( function ()
  {
      result += parseInt( jQuery( this ).attr( 'data-lowest' ) );
  });

Answer 2

I would recommend you to give clear explanation of the code but i have tried to understand your code and tried to debug your code.

You are getting NaN, because some of the values inside forEach are undefined. And when you add undefined to a number, it results in NaN.

Please use below logic and replace in your code.

$('#Tab_BDSP tbody tr td').each(function() {
  result += $(this).attr('data-lowest') ? +$(this).attr('data-lowest') : 0;
});