Applying ID or data- to retrieve TD value

josequinonesii

I'm needing to obtain a value of row's cell ID because I'm going to use the value in another function call. For example, in reference to the columns below, I need to obtain the "Clientid" value of a cell when I click on the row's print-control. Generally, I can easily obtain the value via JQuery or native Javascript but I don't know datatables well enough to get say the 3rd row's client id.

DataTable:

   table = $('#processer').DataTable({
      "paging": false,
      "ordering": true,
      "info": false,
      "searching": false,
      "ajax": "/calling/json/data",
      "columns": [
        {
          "class": 'print-control',
          "orderable": false,
          "data": null,
          "defaultContent": ''
        },
        { "data": "DT_RowId" },
        { "data": "Firstname" },
        { "data": "Lastname" },
        { "data": "RequestCount" },
        {
          "data": "Clientid"
        },
        { "data": "RequestLowest" },
        { "data": "Length" }
      ],
      "order": [[6, 'asc']] //default sort order to first column ascending
    });

josequinonesii

Is it possible that I've not asked this correctly, answered somewhere else or just not possible? please advise?

ignignokt

I'm not really sure what the print-control for a row is. I only know of the table-tools print.

To simply get the content of the third row, 5th column you could do $('tr:nth-child(3) td:nth-child(5)').html() but I doubt that is what you really wanted to know.

You can add a class to any row like so: {data:"Clientid", className:"client_id"} then if you know the unique row ID that is being targeted, you can get the Clientid of that row by targeting the class. Is there an example that you can link to?

allan

I'd suggest using row().data() to get the ID from the row. Or if you have the node already (in an event handler for example) you could just do row.id to access it straight from the DOM.

Allan

josequinonesii

it's an internal app so I do not have link to post. datatable draw w/ JSON data

 <table class="table borderless table-hover" id="processed-bids">
      <thead>
        <tr>
          <th></th>
          <th>Order ID</th>
          <th>First Name</th>
          <th>Last Name</th>
          <th>Telephone Bids</th>
          <th>Client ID</th>
          <th>Lowest Lot #</th>
          <th>Cart Items</th>
          <th>Create Date/Time</th>
        </tr>
      </thead>
    </table>


<tr id="233420" role="row" class="odd"><td class=" print-control"></td><td>233420</td><td>Jose</td><td>Quinones</td><td>0</td><td>148258</td><td>1</td><td>1</td><td>11/19/2014 16:33</td></tr>

//what happens when the first cell with a print icon is clicked
$(document.body).on('click', 'td.print-control', function () {
    var orderid = $(this).closest('tr')[0].id;
    var currentRow = $(this).closest('tr')[0];
    //do more stuff once I get the value of the cell that has <td>148258</td>
  });

josequinonesii

It's not elegant but with the following code, I'm able to obtain the cell text() I need.

I am open to feedback and learning how this can be improved. First step was just getting the data I needed. Thanks for the replies thus far!

  $(document.body).on('click', 'td.print-control', function () {
    var orderid = $(this).closest('tr')[0].id;
    var currentRow = $(this).closest('tr')[0];

    var counter = 0;
    $(currentRow).each(function () {
      var tds = $(this).html();
      $(tds).each(function () {
        counter++;
        if (counter == 6) {
          console.log($(this).text());
        }
      });
    });


   ///i have the clientid to do more magic, now i can carry on.

  

  });

ignignokt

Using row().data as @allan suggested, it would look like this I believe.

$(document.body).on('click', 'td.print-control', function () {
    console.log(table.row($(this).closest('tr')).data()['Client ID']);
});

josequinonesii

I had attempted that but the table object is not in scope, thus my final result. I do appreciate the feedback.

allan

$(document.body).on('click', 'td.print-control', function () {
    var table = $(this).closest('table').DataTable();
    console.log(table.row($(this).closest('tr')).data()['Client ID']);
});

:-)

Allan