How to check occurrence of value in array

Question

var arr = ['09:30:00', '09:45:00', '10:00:00', '10:15:00', '10:30:00', '10:45:00', '11:00:00', '11:15:00'];

var $elem = $("<table>", {
  'class': 'table table-responsive table-bordered overview-table',
  'border': '1'
});
var $tbody = $("<tbody>", {
  'class': 'overview_table_td'
}).appendTo($elem);
$.each(arr, function(i) {
  $tbodyTR = $("<tr>", {}).appendTo($tbody);
  if (i % 4 == 0) {
    $tbodyTH = $("<th>", {
      'scope': 'row',
      'html': arr[i].slice(0, -6),
      'rowspan': '4'
    }).appendTo($tbodyTR);
  }
  $tbodyTH = $("<th>", {
    'scope': 'row',
    'html': arr[i].slice(3, 5)
  }).appendTo($tbodyTR);
});

$(".overview").html($elem);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="overview">
</div>

I am getting unexpected output when I do i % 4 == 0 but I have can I achieve from array that 09 occurs how many times.

If there any solution for it?

Expected Result

Look if in array there is a 09:30:00, 09:45:00. so after slice this value i m getting 2 times 09. so i want to use that counter in i % 2 == 0, and you can see further after slice i can get 10, 4 times so if condition will be i % 4 == 0

So i want to run if condition 2 time when it is 09 and 4 time when it is 10.

Hope you get my expected Result.

Need Help.

Could you please elaborate "unexpected output" a little more? — JHolub
– JHolub, Commented Jun 20, 2017 at 13:00
@JHolub click on "Run code snippet", you'll see. OP you are assuming the dates are grouped by 4 which is incorrect, but I couldn't think of a simple answer right now. — Serge K.
– Serge K., Commented Jun 20, 2017 at 13:01
Thanks @NathanP. ! Well i represents the index, right? So i % 4 == 0 means every 4th time this condition will be true. The output looks expected as far as the code goes. I think you wanna go a different road, right? You wanna have the hours on the left and the minutes (if existing) on the right, right? — JHolub
– JHolub, Commented Jun 20, 2017 at 13:04
@JHolub I just edit my question hope now you will get my question — Nirav Joshi
– Nirav Joshi, Commented Jun 20, 2017 at 13:06
@JHolub in the expected output, we have two rows for 9, four for 10 and 2 for 11, so running this condition every 4th time is incorrect. — Serge K.
– Serge K., Commented Jun 20, 2017 at 13:09

Botimoo · Accepted Answer · 2017-06-20 13:22:02Z

3

You could try saving the previous hour and adding a new cell to the first column only after it changes. In the first iteration old and oldTH are undefined so the hr != old consition is met. After each new cell you should also update the previous cell's rowspan property. This update has to be done even after the .each() finishes.

See the code below:

var arr = ['09:30:00', '09:45:00', '10:00:00', '10:15:00', '10:30:00', '10:45:00', '11:00:00', '11:15:00'];

var $elem = $("<table>", {
  'class': 'table table-responsive table-bordered overview-table',
  'border': '1'
});
var $tbody = $("<tbody>", {
  'class': 'overview_table_td'
}).appendTo($elem);

var counter = 0;
var old, oldTH;

$.each(arr, function(i) {
  $tbodyTR = $("<tr>", {}).appendTo($tbody);
  
  var hr = arr[i].slice(0, -6);
  
  if(hr != old){
  	if(counter > 1){
    	oldTH.attr("rowspan", counter);
    }
    old = hr;
    counter = 0;
  	$tbodyTH = $("<th>", {
      'scope': 'row',
      'html': hr,
    }).appendTo($tbodyTR);
    oldTH = $tbodyTH;
  }
  
  ++counter;
  
  $tbodyTH = $("<th>", {
    'scope': 'row',
    'html': arr[i].slice(3, 5)
  }).appendTo($tbodyTR);
});
if(counter > 1){
  oldTH.attr("rowspan", counter);
}

$(".overview").html($elem);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="overview">
</div>

answered Jun 20, 2017 at 13:22

Botimoo

5996 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

JHolub Over a year ago

Was working on a solution just like that as well but the rowspawn was tricky. Nice you solved it in such an elegant way :)

Me.Name · Accepted Answer · 2017-06-20 13:33:28Z

Was a bit slow in posting and see there's already an answer in the meantime, but posting it anyway if only for not throwing it away right away ;)

var arr = ['09:30:00', '09:45:00', '10:00:00', '10:15:00', '10:30:00', '10:45:00', '11:00:00', '11:15:00'];

var $elem = $("<table>", {
  'class': 'table table-responsive table-bordered overview-table',
  'border': '1'
});
var $tbody = $("<tbody>", {
  'class': 'overview_table_td'
}).appendTo($elem);

var $thHour;

$.each(arr, function(i,val) {
  $tbodyTR = $("<tr>", {}).appendTo($tbody);
  var parts = val.split(':'),
    hour = parts[0];
  if ($thHour && $thHour.hour === hour)
    $thHour.rows++;
    else {
      if($thHour)$thHour.end();
      $thHour = $("<th>", {
        'scope': 'row',
        'html': hour,
      }).appendTo($tbodyTR);
      $thHour.hour = hour;
      $thHour.rows = 1;
      $thHour.end = function(){this.attr('rowspan', this.rows);}
  }
  $tbodyTH = $("<th>", {
    'scope': 'row',
    'html': parts[1]
  }).appendTo($tbodyTR);
});

$thHour.end();

$(".overview").html($elem);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="overview">
</div>

Collectives™ on Stack Overflow

How to check occurrence of value in array

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related