Как передать в функцию ID?

Question

[mrzgt]

Есть кнопка

<button type="button" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="instock.add('<?php echo $product['product_id']; ?>');"><?php echo $buttonundersell_title; ?></button>

есть js в котором 2 функции
в одной product_id передаеться

var instock = {
	'add': function(product_id) {
		$.ajax({
			url: 'index.php?route=module/validOrder',
			type: 'post',
			data: 'product_id=' + product_id,
			dataType: 'json',
		success: function(json) {
			$('.alert, .text-danger').remove();
			$('.form-group').removeClass('has-error');
				$.magnificPopup.open({
				  items: {
					src: 'index.php?route=module/getForm&product_id='+ product_id
				  },
				  type: 'ajax'
				});
		},
	        error: function(xhr, ajaxOptions, thrownError) {
	            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
	        }
		});
	},
	'remove': function() {

	}
}

но тут product_id не срабатывает (data: 'product_id=' + product_id, )

$(document).on("click touchstart", "#undersell-order-submit", function (product_id) {
		$.ajax({
			url: 'index.php?route=module//write',
			type: 'post',
			dataType: 'json',
			data: 'product_id=' + product_id,	
			
			
			
			success: function (data) {
...................
                           }
				}
				if (data['success']) {
						setTimeout(function() {		
					$.magnificPopup.close();
						 }, 5500);	
					$.magnificPopup.open({
				  items: {
					src: 'index.php?route=module//success'
				  },
				  type: 'ajax'
				});
				}
			}
		});
	});

Answer 1

[Immortal_pony]

В первом случае функция ожидает, что вы передадите product_id при вызове и вы, таки, это делаете:

'add': function(product_id) { // в этой строке объявляется функция, которая ожидает в качестве аргумента product_id

/* *** */

onclick="instock.add('<?php echo $product['product_id']; ?>');" // при клике вызывается объявленная ранее функция и ей передается product_id

Во втором же случае product_id нигде не передается. Исправить это можно так:

<!-- Кнопке добавлется data-атрибут "data-product-id", куда записывается product_id: -->
<button type="button" data-product-id="<?= $product['product_id'];?>" data-toggle="tooltip" title="<?php echo $button_wishlist; ?>" onclick="instock.add('<?php echo $product['product_id']; ?>');"><?php echo $buttonundersell_title; ?></button>

$(document).on("click touchstart", "#undersell-order-submit", function (product_id) {
    var product_id = $(this).closest('form').find('button[data-product-id]').data('product-id'); // Получение product_id из data-атрибута.

    $.ajax({
        /* *** */

Answer 2

[Виталий]

По мне правильнее сделать иначе, через addEventListener добавить событие на класс кнопки, ведь как унопок так и событий может быть множество, где функцию вызывать func(this) в хтмл тег кнопки добавить атрибут data-produkt-id="1234"
Функцию описать как func(elem){
// атрибут с айди будет доступен по elem.dataset.produktId
}
Опять же атрибут в ътмл можно добавлять динамически, если такая необходимость есть
Пример здесь (два варианта)

Comments

[Виталий]

mrzgt , посмотри пример по ссылке. записывать продукт ид в переменную обработчика как-то не айс.