increment by one index in array with each click

Question

I'm just getting hands on JavaScript and I can't figure out how to increment by 1 the index selector with each click.

The following code is giving me the index 6, but I would like this index to increment with each click:

var nextCompanyLabel = 6;

label: label[nextCompanyLabel++],

This is the complete code:

$('#addDataset').click(function() {
  var background = randomColor(0.5);
  var nextCompanyLabel = 6;
  var newDataset = {
    label: label[nextCompanyLabel++],
    borderColor: background,
    backgroundColor: background,
    pointBorderColor: background,
    pointBackgroundColor: background,
    pointBorderWidth: 1,
    fill: false,
    data: [],
  };

  for (var index = 0; index < config.data.labels.length; ++index) {
    newDataset.data.push(randomScalingFactor());
  }

  config.data.datasets.push(newDataset);
  window.myLine.update();
});

All help will be appreciated!

Remove var nextCompanyLabel = 6; from the click

Marco de Zeeuw
– Marco de Zeeuw

2017-09-24 08:37:12 +00:00
Commented Sep 24, 2017 at 8:37 — Marco de Zeeuw
– Marco de Zeeuw, Commented Sep 24, 2017 at 8:37

jwpfox · Accepted Answer · 2017-09-24 08:46:23Z

2

You are getting the answer 6 each time because, each time the user clicks, the variable, var nextCompanyLabel is explicitly given the value of 6. i.e.,

var nextCompanyLabel = 6;

Later when you are incrementing it you are using postfix increment, so your value is always 6.

Either declare var nextCompanyLabel = 6; outside the function or make it static.

This should solve your problem.

edited Sep 24, 2017 at 8:46

jwpfox

5,27011 gold badges49 silver badges42 bronze badges

answered Sep 24, 2017 at 8:33

Koushal K H

364 bronze badges

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

Comments

Dij · Accepted Answer · 2017-09-24 08:31:26Z

2

you are reinitialzing nextCompanyLabel to 6 on each click, so incrementation doesn't hold. move the initialization statement outside the event handler function.

var nextCompanyLabel = 6;  //reinitializing nextCompanyLabel, remove this line.
  var newDataset = {
    label: label[nextCompanyLabel++],

answered Sep 24, 2017 at 8:31

Dij

9,8184 gold badges21 silver badges35 bronze badges

Comments

Nick Parsons · Accepted Answer · 2017-09-24 08:32:09Z

1

You could try initializing your nextCompanyLable variable outside the click function like so:

var nextCompanyLabel = 6;
$('#addDataset').click(function() {
  var background = randomColor(0.5);
  var newDataset = {
    label: label[nextCompanyLabel++],
    borderColor: background,
    backgroundColor: background,
    pointBorderColor: background,
    pointBackgroundColor: background,
    pointBorderWidth: 1,
    fill: false,
    data: [],
  };

  for (var index = 0; index < config.data.labels.length; ++index) {
    newDataset.data.push(randomScalingFactor());
  }

  config.data.datasets.push(newDataset);
  window.myLine.update();
});

answered Sep 24, 2017 at 8:32

Nick Parsons

51.7k6 gold badges61 silver badges80 bronze badges

Comments

picci · Accepted Answer · 2017-09-24 08:33:54Z

Assuming your label array to be defined somewhere before in the code, you should initialize the nextCompanyLabel outside the callback function, the updating its value on every click event, in a way such that the index doesn't go out of the array's bounds (for instance using the modulo "%" operator):

var nextCompanyLabel = 6;

$('#addDataset').click(function() {
  var background = randomColor(0.5);
  nextCompanyLabel = (nextCompanyLabel + 1) % label.length;
  var newDataset = {
    label: label[nextCompanyLabel],
    borderColor: background,
    backgroundColor: background,
    pointBorderColor: background,
    pointBackgroundColor: background,
    pointBorderWidth: 1,
    fill: false,
    data: [],
  };

  for (var index = 0; index < config.data.labels.length; ++index) {
    newDataset.data.push(randomScalingFactor());
  }

  config.data.datasets.push(newDataset);
  window.myLine.update();
});

Collectives™ on Stack Overflow

increment by one index in array with each click

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related