user_ne user_ne - 9 months ago 24
jQuery Question

Pass row id in a table displayed using jstl to jquery on click of row

I am displaying list of data as table using jstl foreach loop.On click of a row,the respective ID value in the row needs to be sent to jquery onclick() function.

<table border="1" width="90%" class="table-hover" id="warehouseValue">

<th>Warehouse Id</th>
<th>Warehouse Location</th>
<th>Warehouse City</th>

<c:forEach items="${sessionScope.listWarehouse}" var="description">
<input type="hidden" id="idValue" value="${description.getWarehouseId()}" />

Jquery onclick() function-

$(document).ready(function() {
$("#warehouseValue").click(function() {
var rowId = document.getElementById("idValue").value;
alert("new "+rowId);

Here on click of any row only the first row's id-${description.getWarehouseId()} is getting displayed.
How do i make the respective Id value of each row be sent to onclick() function

Answer Source

You can get like this. td has a child input element.

$("#warehouseValue").on('click','td',function(event) {
        // td has a child input 
        var value1 = $([0]).val();
        var value2 = $("input").val();
        console.log(value1+" "+value2);