Question

I have a page that displays information from my database. I need the user to be able to click the “details” link to view more information pertaining to the record, or click an input box (“check” column), then submit, which will update the status of the record. To achieve this I need to get the id from the “id” column.

this is what the page looks like:

and this is the code that creates it:

  $.ajax({
type: "POST",
url: "lib/req.reqinfo.php",
async: false,
data: {},
success: function(response){
// alert(response);
    var responseArray = response.split(',');    
    for(var x=0;x<responseArray.length;x++){
        id = responseArray[x]; x++;
        dateadded = responseArray[x]; x++;
        needby = responseArray[x]; x++;
        addedby = responseArray[x]; x++;
        unit = responseArray[x]; x++;
        appr = responseArray[x];

        $("#dbinfo").append('<br /><div class="row"><div id="idrow'+x+'" class="onecol bg">'+id+'</div><div class="twocol bg">'+dateadded+'</div><div class="twocol bg">'+needby+'</div><div class="twocol bg">'+addedby+'</div><div class="twocol bg">'+unit+'</div><div class="onecol bg">'+appr+'</div><div class="onecol bg"><label id="detaillink" class="link"><a href="#">details</a></label></div><div class="onecol bg last">'+check+'</div></div>');
    }

I can’t seem to find a solution to point to that particular div to extract the needed information

html:

    <div class="container">
   <br />
<div id="dbinfo" class="row center">
<div class="onecol bg">ID</div>
<div class="twocol bg">Date Added</div>
<div class="twocol bg">Need By</div>
<div class="twocol bg">Added By</div>
<div class="twocol bg">Unit #</div>
<div class="onecol bg">Appr.</div>
<div class="onecol bg">Details</div>
<div class="onecol bg last">check</div>
<div class="onecol"> &nbsp </div>
</div>

   <br />
<div class="row">
    <label class="link"><a href="home.php">Home</a></label>
</div>

Answer 1

You can try this approach..

Add the class details to this

<div class="onecol bg details">Details</div>

// Assuming the details cell has a class called details.
$('.details').on('click', function(){
    var $row = $(this).closest('div.row');

    var id = $row.find('div:eq(0)').attr('id');
    // This is the id you are looking for
});

---

.attr('id');  If that div has a id..

.html();     If you are looking for the text inside it