how can we use js to get hidden value in loop table?

Question

I have the list and loop it in table, and I have table like this:

<table class="table table-striped">
 <tr>
   <td>Hidenfield</td>
   <td>Dropdownlist</td>
 </tr>
//loop here and have result
  <tr>
    <td><input type='hiden' value='1' class='myclass'/></td>
    <td>
       <select id="cateActive" class="activeStatus" name="cateActive">
        <option selected="selected" value="1">Active</option>
        <option value="0">Deactive</option>
       </select>
     </td>
  </tr>
  <tr>
    <td><input type='hiden' value='2' class='myclass'/></td>
    <td>
       <select id="cateActive" class="activeStatus" name="cateActive">
        <option selected="selected" value="1">Active</option>
        <option value="0">Deactive</option>
       </select>
     </td>
  </tr>
  <tr>
    <td><input type='hiden' value='3' class='myclass'/></td>
    <td>
       <select id="cateActive" class="activeStatus" name="cateActive">
        <option selected="selected" value="1">Active</option>
        <option value="0">Deactive</option>
       </select>
     </td>
  </tr>
</table>

and I have a jquery function like this:

$(document).ready(function(){       
    $(".activeStatus").change(function(){

         var categoryId = $('.myclass').val();
         alert(categoryId);

 });
});

when I click in any dropdownlist it has show the value is 1, how can I action on any dropdownbox to get hidden value in row?

Answer 1

Try this code:

$(document).ready(function(){       
    $(".activeStatus").change(function(){
        var categoryId = $(this).parent().prev().find('.myclass').val();
        alert(categoryId);
    });
});

Answer 2

You can use combination of .closest() and .find()

var categoryId = $(this).closest('tr').find('.myclass').val();

Fiddle DEMO

Answer 3

Here is working demo

use delegate as you adding rows on run time and select particular row element:

$(document).ready(function(){       
  $(".activeStatus").on('change',function(){    
      var categoryId = $(this).closest('tr').find('.myclass').val();
      alert(categoryId);    
  });
});

Answer 4

Because $('.myclass') returns an array with more than one elements and the plain call of .val() returns always the value from first elment. So you have to iterate throught the array -here categoryId is your result array (or list).