Troubles with hiding cells with javascript function

Issue

I have a table where I want to hide cells for more than a certain week.
For this I use a function hideWeekCells. It works well when I am using just number instead of currentweek here -> _el.dataset.week > 24 (it works well), but when I tried to change it to dynamic variable current week. There is a problem. Function starts to hide cells at 17 weeks instead of stopping at 24 weeks.

function hideWeekCells(){

        const myAnchor = document.getElementById("myAnchor"); 
        currentweek = myAnchor.dataset.currentweek;     
        
        let weeks = document.querySelectorAll("[data-week]")
        //console.log( 'weeks : ', weeks ); 
        let weeks_array = Array.from( weeks ).filter((_el)=> _el.dataset.week > current week);
        console.log( 'weeks_array final : ', weeks_array ); 
        weeks_array.forEach(element => {
          element.style.display = 'none';
        });       
};

I tried to convert currentweek to numbers with currentweek.valueOf();, but it did not help.

Is it a problem with javascript and my function or maybe it is a problem with my table?

Solution

dataset returns a string by default, so you need to convert them to numbers by Number() for your number comparisons.

Another side note, you should define currentweek with const or let to scope that variable into the function.

function hideWeekCells(){

        const myAnchor = document.getElementById("myAnchor"); 
        const currentweek = Number(myAnchor.dataset.currentweek);     
        
        let weeks = document.querySelectorAll("[data-week]")
        //console.log( 'weeks : ', weeks ); 
        let weeks_array = Array.from( weeks ).filter((_el)=> Number(_el.dataset.week) > currentweek);
        console.log( 'weeks_array final : ', weeks_array ); 
        weeks_array.forEach(element => {
          element.style.display = 'none';
        });       
};

Answered By – Nick Vu

Answer Checked By – Willingham (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.