Se for fazer isso de forma dinâmica, utilize JavaScript com o evento blur
, igualando o valor caso seja menor.
O min
pode ser usado para efeito de validação se você está utilizando um formulário a ser submetido.
Se não for este o caso, pode utilizar o evento blur
abaixo:
document.querySelector("[name=valor-em-dinheiro]").onblur = function(){
// valor do primeiro input. Se for vazio vira 0
var total = document.querySelector("[name=total]").value || 0;
// valor do segundo input
var dindin = this.value;
// se o segundo for menor que o primeiro, iguala
if(Number(dindin) < total) this.value = total;
}
<input type="number" name="total" value="25" required>
<br>
Digite um valor menor e tecle TAB:
<input type="number" name="valor-em-dinheiro" class="form-control text-right" required>
Se for submeter o formulário, pode alterar o min
de forma dinâmica:
document.querySelector("[name=total]").oninput = function(){
// altera o min do segundo input de acordo com o valor digitado
document.querySelector("[name=valor-em-dinheiro]").min = this.value;
}
document.querySelector("[name=valor-em-dinheiro]").oninput = function(){
// seleciona o primeiro input
var total = document.querySelector("[name=total]");
// altera o min de acordo com o valor de total
this.min = total.value;
}
<form>
<input type="number" name="total" value="25" required>
<input type="number" name="valor-em-dinheiro" class="form-control text-right" required>
<br>
<button>Enviar</button>
</form>