Question

I have multiple buttons on my page with the same class. When I click on a button I want to get the value of the nearest input box (remember there are multiple input boxes and buttons on my page with the same classes).

I have:

    $(".deletepostbutton").click(function() {

            var deleteid = $(this).closest('.deleteid').attr('value');

  });


<div class="microblogpostactions">
     <input type="text"  name="deleteid" class="deleteid" value="'.$row['id'].'" />
     <a href="Javascript:void[0]" class="deletepostbutton">Delete</a>
     </div>

<div class="microblogpostactions">
     <input type="text"  name="deleteid" class="deleteid" value="'.$row['id'].'" />
     <a href="Javascript:void[0]" class="deletepostbutton">Delete</a>
     </div>

How can I get the value of the nearest input and make my variable equal to it when a user clicks on the link????

Answer 1

Use .prev() if you’re sure they’re right next to each other. (This should be fastest.)

 var deleteid = $(this).prev().attr('value');

This gets the previous element.

If there’s a chance that there will be another element in between, you could use .siblings():

 var deleteid = $(this).siblings('.deleteid').attr('value');

This will get all siblings inside the same <div> with the deleteid class.