Javascript index

Question

I have a table where I can add lines dynamically, every time I click the button I add a new row to fill the field, my first row comes with index 0

<td><input type="text" name="data[Ticket][0][descricao_ticket]" size="20" placeholder="Informe aqui"></td>

My first information I write normally in the database, but when I need to add a new line I need to go to JS and change the index 0 to 1 so that it does not overwrite the information, how do I leave this index increment alone when requesting a new line? I don’t know much about javascript

(function($) {
    remove = function(item) {
      var tr = $(item).closest('tr');

      tr.fadeOut(400, function() {
        tr.remove();  
      });

      return false;
    }
  })(jQuery);

(function($) {
    AddTableRow = function() {

      var newRow = $("<tr>");
      var cols = "";
      //var indice = 0;

      cols += '<td><input type="text" name="data[Ticket][1][descricao_ticket]" size="20" placeholder="Informe aqui"></td>';

      cols += '<td>';
      cols += '<button type="button" class="btn btn-danger" onclick="remove(this)">Remover</button>';
      cols += '</td>';

      newRow.append(cols);
      $("#details-table").append(newRow);

      return false;
    };
  })(jQuery);

Answer 1

You can count how many elements input to id #details-table own and adding +1 altogether:

var indice = $("#details-table input[type='text']").length+1;

And concatenate into the variable:

cols += '<td><input type="text" name="data[Ticket]['+indice+'][descricao_ticket]" size="20" placeholder="Informe aqui"></td>';

Tip

Can concatenate the variable cols this way below to dry the code:

cols += '<td><input type="text" name="data[Ticket]['+indice+'][descricao_ticket]" size="20" placeholder="Informe aqui"></td>'
+'<td>'
+'<button type="button" class="btn btn-danger" onclick="remove(this)">Remover</button>'
+'</td>';