'Jquery / Javascript dynamic attributes max, min value on change input value

I have a form where there is a field named input_total, which is locked so that its value cannot change.

And another input group which have a min and max value by default.

When any input is changed, I am capturing the sum of the inputs and I want validate that the result is not greater than the input_total

I am trying to validate each input to change the max value depending on the amount remaining, but at no time is the max value greater than the default max value of each input.

This way I try to do any combination in the sum of the inputs but that the result of the sum is never greater than the input_total.

How can I validate or set the max value of each input on change any of the values? For example, if the input_total value is greater than the sum of the inputs, that I can change the max value of any input if the default max value allows it.

This is my code:

// On input sum the input values ​​and determine if there are cents left to equal the value of input_total and set the new max value for each input, preventing that is less than or equal to the placeholder attribute.
function sumar() {
  var input_total = $("#input_total").val();
  var suma = 0;
  for (i = 1; i <= 3; i++) {
    var payment = $("#" + i + "monto").val();
    var max_default = 0;
    max_default = $("#" + i + "monto").attr("placeholder");
    suma = parseFloat(suma) + parseFloat(payment);
    if (suma > input_total) {
      $("#" + i + "monto").prop("max", "0.00");
    } else {
      $("#" + i + "monto").prop("max", max_default);
    }
  }
  $("#paying").html("Paying: $" + suma + " of $" + input_total);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<!-- This is the maximum value to sum -->
<input name="input_total" id="input_total" value="365.00" readonly="readonly" />

<!-- The sum of these inputs must not be greater than 365.00 (#input_total value) -->
<input name="1monto" id="1monto" value="187.00" placeholder="187.00" max="187.00" oninput="sumar()" />
<input name="2monto" id="2monto" value="177.97" placeholder="178.00" max="177.97" oninput="sumar()" />
<input name="3monto" id="3monto" value="0.03" placeholder="206.00" max="0.03" oninput="sumar()">

<h4 id="paying"></h4>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source