[JSP] <JavaScript> foreach로 생성된 테이블 데이터 가져오기

html

<table class="table">
	<thead>
		<tr>
			<th scope="col"></th>
			<th scope="col">쿠폰이름</th>
			<th scope="col">할인율</th>
			<th scope="col">만료기간</th>
			<th scope="col">카테고리</th>
		</tr>
	</thead>
	<tbody>
		<c:forEach var="coupon" items="${couponList}">
			<script>
				console.log('CPID: ' + ${coupon.CPID});
			</script>
			<tr>
			<td>
				<p class="mb-3 mt-4">
					<input type="checkbox">
				</p>
			</td>
			<td>
				<p class="mb-0 mt-4">${coupon.cpName}</p>
			</td>
			<td>
				<p class="mb-0 mt-4">${coupon.discount}%</p>
			</td>
			<td>
				<p class="mb-0 mt-4">${coupon.period}</p>
			</td>
			<td>
				<p class="mb-0 mt-4">${coupon.category}</p>
			</td>
				<td><input type="hidden" value="${coupon.CPID}"></td>
			</tr>
		</c:forEach>
	</tbody>
</table>

---

JavaScript

var selectedCoupons = []; // 습득한 데이터들을 담을 변수

$("input[type=checkbox]:checked").each( // input태그의 타입이 checkbox인 것중 check된 것만 반복
	// 반복문 안의 기능
	function() {
		var couponName = $(this).closest("tr").find("td:eq(1)").text();
		var discount = $(this).closest("tr").find("td:eq(2)").text();
		var period = $(this).closest("tr").find("td:eq(3)").text();
		var category = $(this).closest("tr").find("td:eq(4)").text();
		var CPID = $(this).closest("tr").find("td:eq(5)").text();
		selectedCoupons.push({ // 리스트에 데이터를 담음
			couponName : couponName, 
			discount : discount, 
			period : period,
			category : category,
			CPID : CPID
	});
});