javascript - How to check if values exists in table row? - Stack Overflow

admin管理员组

文章数量:1433147

i have a bit trouble finding the right solution for what I'm trying to do. I have a table:

var _1 = "Something1";
var _2 = "Something2";
var result = "dsadas";
$('<tr><td>' + _1 + '</td><td>' + _2 + '</td><td>' + result + '</td></tr>').appendTo('#test');

td {
border: 1px solid black;
}

<script src=".1.1/jquery.min.js"></script>
<table class="gr">
  <thead>
    <tr>
      <th>Something1</th>
      <th>Something2</th>
      <th>Result</th>
    </tr>
  </thead>
  <tbody id="test">
    <tr>
      <td>Something1</td>
      <td>Something2</td>
      <td>32</td>
    </tr>
  </tbody>
</table>

i have a bit trouble finding the right solution for what I'm trying to do. I have a table:

var _1 = "Something1";
var _2 = "Something2";
var result = "dsadas";
$('<tr><td>' + _1 + '</td><td>' + _2 + '</td><td>' + result + '</td></tr>').appendTo('#test');

td {
border: 1px solid black;
}

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="gr">
  <thead>
    <tr>
      <th>Something1</th>
      <th>Something2</th>
      <th>Result</th>
    </tr>
  </thead>
  <tbody id="test">
    <tr>
      <td>Something1</td>
      <td>Something2</td>
      <td>32</td>
    </tr>
  </tbody>
</table>

I'm pushing it like I showed u above.

And when I'm adding new element dynamically I want to check if values of columns im pushing into table exist in the table and: If not, push new one, if exist, just change the result column. How can I archive that?

• javascript
• jquery

Share Improve this question Follow edited Dec 13, 2017 at 6:24 Pedram 16.6k1010 gold badges4747 silver badges7373 bronze badges asked Dec 13, 2017 at 6:05 HiurakoHiurako 17733 silver badges1111 bronze badges 12

• 3 Did you tried anything? – Pedram Commented Dec 13, 2017 at 6:06
• 2 Just did the dynamically adding thing, and I don't have an idea for the rest. So, I don't really have any attempted code for the checking in the table. :/ – Hiurako Commented Dec 13, 2017 at 6:09
• Show what you have tried so far – Harsh Patel Commented Dec 13, 2017 at 6:09
• 2 @Hatchling The simplest way is if($('table tr td').text() == '32') – Pedram Commented Dec 13, 2017 at 6:11
• @Mr.x The problem is that I don't want to check the column based on Result, but on the first and second column which is Something 1 and Something 2 in my case. And if these 2 values match to these values I want to push, then change the result. – Hiurako Commented Dec 13, 2017 at 6:13

 |  Show 7 more ments

2 Answers 2

Sorted by: Reset to default 2

$(function(){
    $("#addtr").on('submit', function(){
        var something1 = $("#something1").val();
        var something2 = $("#something2").val();
        var result = $("#result").val();
        var inc = 0;
            
        var cnt = 0;    
        $('#tbody tr').each(function(i, el){
            var value1 = $(el).children().eq(0).text();
            var value2 = $(el).children().eq(1).text();
            var res = $(el).children().eq(2).text();
            if(value1 == something1 && value2 == something2){
                inc = (inc)+1;
                res = parseInt(res)+(1);
                $(this).children(":eq(2)").text(res);
            }
            cnt = cnt+1;
        })
        if(inc == 0){
            var add = "<tr><td>"+something1+"</td><td>"+something2+"</td><td>"+result+"</td></tr>";
                $(".gr tbody").append(add);
        } else {
            //console.log("exist");
        }
         
        return false;
    })
})

<script src="https://code.jquery./jquery-3.2.1.min.js"></script>
<table class="gr">
  <thead>
    <tr>
      <th>Something1</th>
      <th>Something2</th>
      <th>Result</th>
    </tr>
  </thead>
  <tbody id='tbody'>
    <tr>
      <td>Something1</td>
      <td>Something2</td>
      <td>32</td>
    </tr>
  </tbody>
</table>
<form method='post' action='#' id='addtr'>
    <input type='text' name='something1' id='something1' />
    <input type='text' name='something2' id='something2' />
    <input type='text' name='result' id='result' />
    <button type='submit' id='submit'>Add</button>
</form>

I think this could be solution to your problem please check i am adding dynamic input using textbox please enter the same value in the both textbox then the result value will be incremented otherwise new <tr> will be created

Something like this will help to achieve what you need:

var _1 = "Something1";
var _2 = "Something2";
var result = "dsadas";

var change = false;
$("tbody#test").find("tr").each(function() {
  var $td = jQuery(this).find("td");
  if ($td.first()[0].innerHTML == _1 && $td.next()[0].innerHTML == _2) {
    change = true;
    $td.last()[0].innerHTML = result;
  }

});

if (!change) {
  $('<tr><td>' + _1 + '</td><td>' + _2 + '</td><td>' + result + '</td></tr>').appendTo('#test');
}

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="gr">
  <thead>
    <tr>
      <th>Something1</th>
      <th>Something2</th>
      <th>Result</th>
    </tr>
  </thead>
  <tbody id="test">
    <tr>
      <td>Something1</td>
      <td>Something2</td>
      <td>32</td>
    </tr>
  </tbody>
</table>

本文标签： javascriptHow to check if values exists in table rowStack Overflow