вот это круть. Спасибо огромное!

понял. теперь и фильтруют только инпуты с нужными классами и текстовые вставки делаются в зависимости от класса.

Помогите пожалуйста.

Вставил скрипт и инпуты на сайт. Работают как надо.
Но потом увидел, что в форме ниже при нажатии на плюс или минус срабатывает проверка на правильность заполнения полей. И все загорается красным (потому что еще не заполнено.

Если я убираю скрипт, который за это отвечает - то перестает работать инпут новый. На плюс нажимаю, +1 происходит, и потом возвращается обратно на 0.

Что не так делаю?

// Example starter JavaScript for disabling form submissions if there are invalid fields
    (function() {
      'use strict';
      window.addEventListener('load', function() {
        // Fetch all the forms we want to apply custom Bootstrap validation styles to
        var forms = document.getElementsByClassName('needs-validation');
        // Loop over them and prevent submission
        var validation = Array.prototype.filter.call(forms, function(form) {
          form.addEventListener('submit', function(event) {
            if (form.checkValidity() === false) {
              event.preventDefault();
              event.stopPropagation();
            }
            form.classList.add('was-validated');
          }, false);
        });
      }, false);
    })();


    var sklon = (n, obj) => n+" "+obj[(n%100>4 && n%100<20)?2:[2, 0, 1, 1, 1, 2][(n%10<5)?n%10:5]];

  		var obj = {kom:['комната', 'комнаты', 'комнат'],
  							san:['санузел', 'санузла', 'санузлов'],
  							chas:['час', 'часа', 'часов']},
  		inp = document.querySelectorAll('.san, .kom, .chas');
  		inp.forEach((el, i)=>{
  			el.value = 0;
  			var val, cl = el.className;
  			el.previousElementSibling.onclick = e => {
  				val = parseInt(el.value);
  				if (val > 0) val--;
  				el.value = sklon(val, obj[cl]);
  			};
  			el.nextElementSibling.onclick = e => {
  				val = parseInt(el.value);
  				val++;
  				el.value = sklon(val, obj[cl]);
  			};
  			el.onchange = e => {
  				val = parseInt(el.value);
  				e.target.value = sklon(val, obj[cl]);
  			};
  		});

А как в этих инпутах отслеживать изменения и получать из них значения.

я попробовал в инпуте прописать onchange="alert(this.value)", но он никак не реагирует на изменения в инпуте.

Дело в том, что onchange наступает после потери фокуса на твоем инпуте. Т.е. нужно "покинуть" поле, тогда сработает событие.

the_little,
Обработчик события change уже прописан в вашем скрипте - строки 40-43 в примере пост№22.
Так что не надо ничего вписывать в инпут - вписывайте в этот обработчик.
Там и значение уже есть.

В инпут я вписывал для проверки.
У меня каждый инпут имеет свой id.
И я пытался получить для одного значение val, но ничего не получалось.