Match class against table row

Question

I have the following code:

var sum = 0;
    $("#scLD > tbody > tr > td:nth-child(2)").each(function () {
        var x = $(this);
        if (x.parent().hasClass(/^onHandTdmm([0-9]+)$/)) {
            var y = parseFloat(x.text(), 10) || 0;
            sum += y;
        }
        if (x.parent().hasClass("onHandGrand")) {
            x.html(sum);
            sum = 0;
        }
    })

I am trying to search through a column and if any of the cells parent(the row) contains a certain class name followed by any single number to add it. So basically if the parent contains the class of onHandTdmm followed by any number (example onHandTdmm1). The regex I came up with (/^onHandTdmm([0-9]+)$/) just returns 0 in my function.

Not sure that you can use regex in hasClass() method? But: http://stackoverflow.com/questions/13878759/jquery-match-part-of-class-with-hasclass — sinisake, Dec 14 '16 at 20:10
Do you have classes that begin with `onHandTdmm` that don't have a number after it? You could just use the selector `[class*=onHandTdmm]` which looks for that string anywhere in the class. — Barmar, Dec 14 '16 at 21:11

score 1 · Answer 1 · answered Dec 14 '16 at 20:20

you need to escape: \( instead of (.
Don't jquery-fy everything, this task is more easy in vanillajs.

function TestCtrl() {
  var tests = document.querySelectorAll('.test');
  
  function hasClassHandTdmm(element) {
    var re = /onHandTdmm\([0-9]+\)/
    var parent = element.parentNode;
    
    if(re.test(parent.className)) {
      parent.classList.add('matches');
    }
    
  }
  
  
  Array.prototype.forEach.call(tests, hasClassHandTdmm);
}

document
  .addEventListener('DOMContentLoaded', TestCtrl);
;

.matches {
  background: pink;
}

<div class="onHandTdmm(1) ">
  <span class="test">TEST</span>
</div>

<div class="">
  <span class="test">TEST 2</span>
</div>

There's no `()` in the class name, it's just `onHandTdmm1`. – Barmar Dec 14 '16 at 21:09 — Barmar, Dec 14 '16 at 21:09

Tyler Roper · Accepted Answer · 2016-12-14T21:12:52.850

Instead of looping through all the cells and matching the parent that have the class, why not only find rows that have the class, and then manipulate the cell as you need?

For the Regex portion you'll need to use .test, as jQuery selectors don't natively handle regex.

Working JSFiddle: https://jsfiddle.net/j4d3zgqt/4/

var sum = 0;
$("#scLD > tbody > tr").each(function() {
    var $row = $(this);
    var $cell = $(this).find('td:nth-child(2)');

    if (/^onHandTdmm([0-9]+)$/.test($row.attr("class"))) {
        var y = parseFloat($cell.text(), 10) || 0;
        sum += y;
    }
    if ($row.hasClass("onHandGrand")) {
        $cell.html(sum);
        sum = 0;
    }
});

score 0 · Answer 3 · answered Dec 14 '16 at 20:10

0

I believe it may be possible you are overthinking this task. From my understanding, a simple indexOf command should give you the existence of the classname and then you can evaluate the integer that follows separately.

answered Dec 14 '16 at 20:10

Commodore64

69
3

score -1 · Answer 4 · answered Dec 14 '16 at 21:03

-1

One thing is just try to use val() instead of text() function with the above provided answers.

answered Dec 14 '16 at 21:03

Danny

45
1
8

What does that have to do with the problem with using a regexp in `.hasClass()`? – Barmar Dec 14 '16 at 21:08
You can't use `.val()` on a ``. – Tyler Roper Dec 14 '16 at 21:12

Match class against table row

4 Answers4