Как получить через js верный data параметр?

Question

[Максим Черных]

При изменении значения select меняется и data значения

$("#calculationform-product").on( "change", function() {
		var product = $(this).val();
		switch (product) {
			case 'product1':
				product1();
				$(this).attr('data-coefficient', coefficient1);
				$(this).attr('data-paper', countOnPaper1);
				break;
			case 'product2':
				product2();
				$(this).attr('data-coefficient', coefficient2);
				$(this).attr('data-paper', countOnPaper2);
				break;
			case 'product3':
				product3();
				$(this).attr('data-coefficient', coefficient3);
				$(this).attr('data-paper', countOnPaper3);
				break;
			case 'product4':
				product4();
				$(this).attr('data-coefficient', coefficient4);
				$(this).attr('data-paper', countOnPaper4);
				break;
			case 'product5':
				product5();
				$(this).attr('data-coefficient', coefficient5);
				$(this).attr('data-paper', countOnPaper5);
				break;
			case 'product6':
				product6();
				$(this).attr('data-coefficient', coefficient6);
				$(this).attr('data-paper', countOnPaper6);
				break;
			case 'product7':
				product7();
				$(this).attr('data-coefficient', coefficient7);
				$(this).attr('data-paper', countOnPaper7);
				break;
		}
	});

Data меняется в структуре html

Но при получении его выводится первое значение


При использовании value всё ок, а с data такая беда, как можно решить?

Answer 1

[Максим Черных]

Довольно быстро нашёл решение)

В select добавил пустые data значения

В js же не создавал атрибут с data, а изменял чрез .data();

$("#calculationform-product").on( "change", function() {
		var product = $(this).val();
		switch (product) {
			case 'product1':
				product1();
				$(this).data('coefficient', coefficient1);
				$(this).data('paper', countOnPaper1);
				break;
			case 'product2':
				product2();
				$(this).data('coefficient', coefficient2);
				$(this).data('paper', countOnPaper2);
				break;
			case 'product3':
				product3();
				$(this).data('coefficient', coefficient3);
				$(this).data('paper', countOnPaper3);
				break;
			case 'product4':
				product4();
				$(this).data('coefficient', coefficient4);
				$(this).data('paper', countOnPaper4);
				break;
			case 'product5':
				product5();
				$(this).data('coefficient', coefficient5);
				$(this).data('paper', countOnPaper5);
				break;
			case 'product6':
				product6();
				$(this).data('coefficient', coefficient6);
				$(this).data('paper', countOnPaper6);
				break;
			case 'product7':
				product7();
				$(this).data('coefficient', coefficient7);
				$(this).data('paper', countOnPaper7);
				break;
		}
	});

Answer 2

[necrodeflorator]

JQuery насколько я помню читает дата атрибуты один раз в память и потом юзает(сет и нет) их из памяти, а не из dom
Если планируете получать через jq, то надо устанавливать так:
$(this).data('paper', newValue)

Answer 3

[Pashok Doom]

В таких случаях лучше писать, например, $(this).attr('data-coefficient', coefficient1);