[SOLVED] Get a stepper value on change in a virtual list


I have rendered steppers in a virtual list. Am looking for ways to capture the change event of the stepper value together with the data-so_uuid value.

'<li data-so_uuid="{{so_uuid}}" >' +
	'<a href="#" class="item-content">' +
		'<div class="item-inner">' +
			'<div class="item-title-row">' +
				'<div class="item-title">' +
					'<div class="chip">' +
						'<div class="chip-label">{{so_description}}</div>' +											
				'</div>' +
				'<div class="item-after">' +
					'<div class="stepper stepper-init stepper-fill color-green cart_stepper">'+
						'<div class="stepper-button-minus"></div>'+
						'<div class="stepper-input-wrap">'+
							'<input type="text" value="{{so_quantity}}" min="0" max="100" step="1" readonly>'+
						'<div class="stepper-button-plus"></div>'+
				'</div>' +									
			'</div>' +
		'</div>' +
	'</a>' +

Any Ideas?

Found a solution

Added a class class="my_stepper" to the input the input tag and access the value on click using

$('.virtual-list .cart_stepper').on('click', 'li', function () {

It worked!

1 Like