@Pestrich

Как создать кнопки увеличения/уменьшения количества товара?

Имеется вот такая форма:
5c3e4b20ca511847438089.png
Код:
<?php $product_value = 1; ?>
	<p>Число: <input type="text" id="col" value="<?php echo $product_value ?>"></p>
	<button id="buy">Купить</button>
	<button id="plus">+</button>
	<button id="minus">-</button>

$(document).ready(function() {
	$('#buy').on('click', myAJAX);
});

function myAJAX() {
	$.ajax({
		url : "add_to_cart.php",
		type : "GET",
		data : { "count" : $('#col').val() },
		success : function(data) {
			console.log(data);
		}
	});
}

<?php  
	$count = $_GET['count'];
	if ($count == 0) {
		echo "Равна нулю";
	} else if ($count == 1) {
		echo "Равна единице";
	} else {
		echo "Введите корректное значение";
	}
?>

Хочу сделать так, чтобы при нажатии на кнопки +/- изменялось значение в input, а значение по умолчанию было 1. Пробовал на кнопки вешать выполнение js и в нем подключать php, но ничего не получилось. Надеюсь на помощь.
  • Вопрос задан
  • 3508 просмотров
Решения вопроса 2
@DanKud
$('#plus').on('click', function () {
    let num = +$('#col').val();
    $('#col').val(num + 1);
});
$('#minus').on('click', function () {
    let num = +$('#col').val();
    if (num > 1) $('#col').val(num - 1);
});
Ответ написан
Комментировать
zorakk
@zorakk
полтора года веба
<label for="input">Число:</label> 
<input name="input" type="number" id="col" value="1">
<button id="buy">Купить</button>
<button id="plus">+</button>
<button id="minus">-</button>


let col = document.getElementById('col');
let plus = document.getElementById('plus');
let minus = document.getElementById('minus');

plus.onclick = function() {
  col.value = parseInt(col.value) + 1;
}

minus.onclick = function() {
  col.value = parseInt(col.value) - 1;
}


Пример необходимо доработать. Например, сделать так, чтобы количество товара никогда не было отрицательным.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы