EDarrien EDarrien - 6 months ago 9
PHP Question

jQuery and PHP while loop php

I have a a page that produces data from a

while
loop as follows:

echo " <ul class=\"task-list\">
<li>
<div class=\"task-checkbox\">
<input type=\"checkbox\" class=\"list-child\" value=\"\" />
</div>
<div class=\"task-title\">
<div class=\"request_hidden_id\" >$request_id</div>
<span class=\"task-title-sp\">$request_summary</span>
<span class=\"badge badge-sm label-success\">2 Days</span>
<div class=\"pull-right hidden-phone\">
<button class=\"btn btn-success btn-xs\"><i class=\" fa fa-check\"></i></button>
<button class=\"btn btn-primary btn-xs\"><i class=\"fa fa-pencil\"></i></button>
<button class=\"btn btn-danger btn-xs\"><i class=\"fa fa-trash-o \"></i></button>
</div>
</div>
</li>
</ul>


A jQuery that I need to reference the class(
request_hidden_id
) value is as follows:

$( ".btn.btn-primary.btn-xs" ).click(function() {
var acct_id = $('.request_hidden_id').text();
alert( "are you sure you want to delete " + acct_id );
$("#edit-service-request-modal").modal('show');
});


When the alert fires, all the id with the class given in the jQuery from the while loop shows in the alert box. Any ideas how to have it only reference the one selected? Thank you

Answer

You can use this to reference the element you clicked, then walk up the dom till you reach the .task-list container, then search the container for the current .request_hidden_id

$( ".btn.btn-primary.btn-xs" ).click(function() {
    var acct_id = $(this).closest('.task-list').find('.request_hidden_id').text();
    alert( "are you sure you want to delete " + acct_id );
    $("#edit-service-request-modal").modal('show');
});