Как правильно ограничить минимальное значение input?

Question

[WebforSelf]

Есть такой скрипт, добавления количества товара.
Со стороны PHP я имею переменную которая задает минимальное количество товара , к примеру 10

Вот набросал форму и скрипт.

Получается задумка такая, мне надо чтоб клиент не смог взять меньше чем значение моей переменной.
Поэтому при загрузке страницы я передаю эту переменную в значение value, а далее мне опираясь на нее надо чтоб клиент не мог клацнуть меньше 10.

Как это правильно реализовать?

Comments

[imdeveloper]

<input type="number" min="10">

[WebforSelf]

imdeveloper, да вот думал так, но хотелось бы через js решить.

Answer 1

[Steppp]

$(document).on('click', '.counter__minus', function() {
  const parent = $(this).closest('.counter');
  let count = +parent.find('input').val() - 1;
  if (count <= 10) count = 10;
  parent.find('input').val(count);
  return
});
$(document).on('click', '.counter__plus', function() {
  const parent = $(this).closest('.counter');
  let count = +parent.find('input').val() + 1;
  if (count <= 10) count = 10;
  parent.find('input').val(count);
  return
});
$(document).on('click', '.counter__count input', function() {
  const parent = $(this).closest('.counter');
  let count = +$(this).val();
  if (count < 10 || !isNumeric(count)) {
    parent.find('input').val(10)
  }
  return
});