Delete element from array

Question

I have a form with 60 input textbox with name number[], of those 60 numbers I can only select a quantity x( quantity can be variable ); as I do for when the user unchecks the checkbox the number is removed from the array ?

var i = 0,
  selecionados = [],
  maximo = {
    {
      $dados - > numeros
    }
  },
  input = 0;

Array.prototype.remove = function() {
  var what, a = arguments,
    L = a.length,
    ax;
  while (L && this.length) {
    what = a[--L];
    while ((ax = this.indexOf(what)) !== -1) {
      this.splice(ax, 1);
    }
  }
  return this;
};

//***************************************************************

function selecione(valor) {

  selecionados.push(valor);

  for (i = 1; i < selecionados.length; i++) {
    if (selecionados[valor] == valor) {
      selecionados.remove('' + valor);
      alert('ok');
      console.clear();
      console.log(selecionados);
    }
  }

  console.log(selecionados);

}

<div class="container-fluid">
  <form name="form" action="{{ route('aposta.salvar')}}" method="POST">

    <input type="hidden" name="numeros" value="{{ $dados->numeros }}">
    <input type="hidden" name="cotacao" value="{{ $dados->cotacao }}"> @for ($i = 1; $i
    < 61; $i++) <div class="col-md-1">
      <input type="checkbox" onclick="selecione({{$i}})" id="{{$i}}" name="numero[]" value="{{ ($i < 10) ? (0 . $i) : $i }}" />
      <div class="box box-primary checkbox" id="box-{{ $i }}" type="checkbox">
        <div class="box-body box-profile">
          <h5 class="text-center">{{ ($i
            < 10) ? (0 . $i) : $i }}</h5>
        </div>
      </div>
</div>
@endfor

<div class="btn-inline">
  <a href="#" onClick="history.go(0)" class="btn btn-warning ">Limpar</a>
  <a href="#" onclick="gerar()" class="btn btn-danger">Gerar</a>
  <button type="submit" class="btn btn-primary  btn-flat">Proximo</button>
</div>
</form>
</div>

Answer 1

I assume you already have the element index you want to remove, because of this code snippet here:

if (selecionados[valor] == valor) {

So you just need to give one splice in the array passing this same value in the index:

selecionados.splice(valor, 1);

Remember that splice will return the value that was removed from selecionados and selecionados will be modified by splice.

That method remove that you are using, may even work but it is unnecessary and heavy for what you are doing.

Answer 2

You can do it like this:

var selecionados = [];
function selecione(item) {
  // Verifique se o item já existe no objeto "selecionados"
  let test = selecionados.filter(x => x === item);
  // Faça uma condição que verifica se o
  // número de elementos retornados é maior que 0
  // Se for remove o item, se não adiciona
  (test.length) ? selecionados.splice(selecionados.indexOf(item), 1) : selecionados.push(item);
  console.log('Selecionados: ', selecionados);
}

<input type="checkbox"  onclick="selecione(1)" /> Item 1
<input type="checkbox"  onclick="selecione(2)" /> Item 2
<input type="checkbox"  onclick="selecione(3)" /> Item 3
<input type="checkbox"  onclick="selecione(4)" /> Item 4
<input type="checkbox"  onclick="selecione(5)" /> Item 5
<input type="checkbox"  onclick="selecione(6)" /> Item 6
<input type="checkbox"  onclick="selecione(7)" /> Item 7
<input type="checkbox"  onclick="selecione(8)" /> Item 8