Tengo una consulta y es la siguiente:
Tengo un formulario con datos cargados en los respectivos input y lo que quiero es que cuando no existan cambios en los input el boton se mantenga deshabilitado pero si existen cambios se habilite el boton.
$(document).ready(function(){
metodos.CambioInputValor();
});
var metodos = function(){
return{
CambioInputValor:function(){
var inivalNombre = $("#idNombre").val();
$("#idNombre").on('input',function(){
if ( $("#idNombre").val() != inivalNombre ) {
$("#btnActualizar").attr('disabled',false);
}else{
$("#btnActualizar").attr('disabled',true);
}
});
var inivalEdad = $("#idEdad").val();
$("#idEdad").on('input',function(){
if ( $("#idEdad").val() != inivalEdad ) {
$("#btnActualizar").attr('disabled',false);
}else{
$("#btnActualizar").attr('disabled',true);
}
});
}
};
}();
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<div class="container mb-10">
<form action="" id="idForm">
<div class="row col-lg-12">
<div class="form-group">
<label for="idNombre">Nombre</label>
<input type="text" id="idNombre" value="Darwin" class="form-control">
</div>
</div>
<div class="row col-lg-12">
<div class="form-group">
<label for="IdEdad">Edad</label>
<input type="text" id="idEdad" value="27" class="form-control">
</div>
</div>
<button type="button" class="btn btn-success" id="btnActualizar">Actualizar</button>
</form>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>