How to check if a value exist in a table and return the value of a cell in that row

Question

I need to check the entire table if there is a value(RESERVED) on column 1 and return the value of cell 0 of that row where the value was found.

Basicly click on a button, run the function and return the value of cell 0 of the row where the value(REVERVED) was found.

I like to do this with plain javascript not jquery if I could.

The function below works if I physically click on that row.

  <input type="button" value="☑️ check if RESERVED exists" onclick="findValueInRow()"> //
  <br>
  <br>

  <table id="table2">
    <thead>
      <tr>
        <th>ID</th>
        <th>Contact</th>
        <th>Country</th>
      </tr>
    </thead>
    <tr>
      <td>1</td>
      <td>Maria Anders</td>
      <td>Germany</td>
    </tr>
    <tr>
      <td>2</td>
      <td>RESERVED</td>
      <td>Mexico</td>
    </tr>
    <tr>
      <td>1</td>
      <td>Roland Mendel</td>
      <td>Austria</td>
    </tr>
    <tr>
      <td>3</td>
      <td>Helen Bennett</td>
      <td>UK</td>
    </tr>
    <tr>
      <td>4</td>
      <td>RESERVED</td>
      <td>Canada</td>
    </tr>
    <tr>
      <td>5</td>
      <td>Giovanni Rovelli</td>
      <td>Italy</td>
    </tr>
  </table>
</body>



      function findValueInRow()
   {
    table = document.getElementById("table2");
    for(var i = 1; i < table.rows.length; i++)
     {
     table.rows[i].onclick = function()
      {
     // get the selected row index
      rIndex = this.rowIndex;
    var produtcID = this.cells[1].textContent;   
    //check to see if value RESERVED exists in the table
     if(produtcID == "RESERVED" )
      {
      alert(this.cells[0].textContent);

      }
      else{
       //my other code if the value is not found
       }//end else                    
       };
  }
   }

Whats your actual question? What do you want the code to do? Please give an example for a table with example data. — Nico Gräf, Mar 26 '20 at 18:46
I've edited the question with some code. Basically I need to click on a button, run the function and return the value of cell 0 of the row where the value(REVERVED) was found. The code works except that I don't want to click on the row. — user2916405, Mar 26 '20 at 20:16
In case you like some, you can upvote them or accept one (under voting button). — Jan, Mar 26 '20 at 20:24

Jan · Accepted Answer · 2020-03-26T20:23:14.273

2

Is it right now ?

function findValueInRow() {
  table = document.getElementById("table2");
  var rows = table.rows;
  for (var i = 1; i < rows.length; i++) {
    var cols = rows[i].cells;
    for (var c = 0; c < cols.length; c++) {
      if (cols[c].innerText == 'RESERVED') {
        return cols[0].innerHTML;
      }
    }
  }
  return '';
}

table {
  background:gray;
}
td, th {
  background:white;
}

<input type="button" value="☑️ check if RESERVED exists" onclick="alert(findValueInRow())">
<br>
<br>

<table id="table2">
  <thead>
    <tr>
      <th>ID</th>
      <th>Contact</th>
      <th>Country</th>
    </tr>
  </thead>
  <tr>
    <td>1</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>2</td>
    <td>RESERVED</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>1</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>3</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>4</td>
    <td>RESERVED</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>5</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
</table>

edited Mar 26 '20 at 20:23

answered Mar 26 '20 at 19:15

Jan

2,178
3
14
26

Better (More DRY & Modular) than the original code. But he wrote this " if a table has a value on column 1 - return the value of cell 0 of that row". Anyway, the Q is not so clear. (This is not your fault). – Ezra Siton Mar 26 '20 at 19:20
He has to learn a bit more anyway and was sure how exactly his logic should work, so made short demo for fun, but suppose DOM is almost self explanatory, so not hard to understand what is going on there... – Jan Mar 26 '20 at 19:24
2nd version, now works after click on table, btw global part should be called from onload too, but when script tag is next to body, it is not a must, but good practise (in case it would be run before body tag ends - ex. inside common HEAD tag - during page load, table may not exist). – Jan Mar 26 '20 at 19:38
Yes -Tom, that's exactly it, thank you. Also thanks to everyone else that contributed. – user2916405 Mar 26 '20 at 20:48

How to check if a value exist in a table and return the value of a cell in that row

1 Answers1