Removing Blank Cells In A Table Row Prior To Performing Calculation?

I am the caretaker of our disc golf league’s weekly scoring system. Player handicaps are calculated each week based on a simple formula that involves the current score plus 4 previous scores. In order to establish a handicap, a player must have a minimum of 3 scores. The online system is written in PHP interacting with a MySQL database. The system lets the players see their current handicaps. (I’ve been writing PHP code for about 20 years).

I’m an old dog trying to learn new tricks. In this case . . . Javascript. I wanted to allow players to see their handicaps at different points throughout the season. Instead of doing this with PHP, I decided to see if it could be done with Javascript. In the first iteration, I generated a grid of players and scores (using PHP/MySQL) showing the players along the left and the times each player played across the top. When the mouse arrow is hovered over any player score, the Javascript code calculates the handicap based on the hovered score and the four scores to its left. No handicap is calculated for the first two scores in a row: (view source)

In a second iteration, I decided to generate a grid with the players on the left and the event dates across the top. This produces blank cells in almost all of the rows. The blank cells have been a major stumbling block in trying to get the Javascript to do what I want it to do. Here’s the second iteration: (view source)

I am using the same Javascript code for both of these (even though I’ve spend hours and hours researching and modifying the second one . . . with no luck).

I’m hoping that the collective expertise of this group can provide guidance to enlighten a novice as to how to get Javascript to either (1) ignore the empty cells in a row prior to adding values to the array or (2) take all the values in a row, move the non-zero values to the left, then remove the empty (NULL) values and assign what’s left to the array or (3) something else that I can’t envision.

Thanks in advance for taking a look.

Because the current code putting values into the scores array is removing non-numbers, and you are only using the last 5 scores in the calculateHandicap() function, all you really need to do is change the for() loop, from starting at index - 4, to starting at 1. Note: the player’s name is index = 0, so you can skip it in all the loops/conditional tests…

See if using the following for the for() loop produces the result you expect -

				for (let i = 1; i <= index; i++) {

Wow! I can’t believe how simple the solution is. :smile: Thank you very much for taking the time to read my post, review the code and teach me something new. I am grateful for your kindness and for your willingness to share your skill and expertise.

I mean, I also wouldnt do this in a mouseover, forcing the browser to re-calculate the values every time a cell is hovered over…

Also, i’m not sure your handicap calculation is accurate for what I find online, but… you do you :smiley:

Totally agree with you about re-calculating the values on every hover. It was more a learning exercise than a practical application. Trying to wrap my head around Javascript.

As far as the handicap calculation, this is a formula that our league has used for the past 15+ years. Our system originated from a php class developed by George Clarke for ball golf back in 2011:

It’s served us well through the years and by general consensus of our players, we agree to abide by the calculated handicaps the formula produces.

Alright, thats completely fair, I was just googling to try and understand the formula, and every site i find mentions that the calculation was changed in 2020, and didnt resemble what you’re using. But, as I said, you do you. If your league and club are good with that formula, cool :slight_smile: