0

Tenho essa tabela dinâmica

            <form action="{{route ('AddDocumentosAbertura')}}" method="post" accept-charset="UTF-8" enctype="multipart/form-data">
            {{ csrf_field() }}
                 <table >
                    <thead>
                        <th>CPF ou CNPJ</th>
                        <th>Porcentagem</th>
                        <th></th>
                    </thead>
                    <tbody id="table" class="table mg-b-0">
                        <tr>
                        <td>
                            <input type='text' name="cpf_ab[]" class='form-control' > 
                        </td>

                        <td>
                            <input type='text' class="cpf form-control"  name='porcentagem[]' >
                        </td>
                        <td><button type="button" class="tg88 btn btn-primary button88" id="addRowBtn">+</button></td>
                        </tr>
                    </tbody>
                </table>
      <button class="btn btn-primary bd-0">Enviar</button>
      </form>

Quando o user clicar em "+" ele irá adicionar uma nova linha na tabela para preencher dados. O js que faz isso abaixo:

  var tbody = $('#table').children('tbody');
var table = tbody.length ? tbody : $('#table');

$('#addRowBtn').click(function(){

    table.append("<tr><td><input type='text' name='cpf_ab[]' class='cpf form-control' ></td><td><input type='text' class='cpf form-control'  name='porcentagem[]' ></td><td><button type='button' class='btn btn-danger delRowBtn'>-</button></td></tr>");
})

$(document.body).delegate(".delRowBtn", "click", function(){
        $(this).closest("tr").remove();        
    }); 

Até ai tudo bem, está tudo certo, porém quando eu envio esses dados para meu controller, só é enviado a linha que foi colocada manualmente dentro da tabela (a primeira linha). Também testei colocar essa linha que é adicionada dinamicamente, coloquei ela de forma manual dentro da tabela, e deu certo... não estou conseguindo entender o por que que a adição de linhas dinâmicas não está indo para o servidor

Código que do php (laravel)

$dataForm = $Request->except(['_token']);
$countcc = count($dataForm['cpf_ab']);

  for ($i = 0; $i < $countcc; $i++) {
                $ans = [
                    'cpf_ab' => $dataForm['cpf_ab'][$i],
                    'porcentagem' => $dataForm['porcentagem'][$i],

                ];

             $fctr = AB_Socios::insert($ans);
            }
1
  • Experimenta fazer o envio do seu formulário via ajax.
    – Marcel
    Commented 15/03/2019 às 0:51

1 Resposta 1

0

Criei um formulário com Bootstrap e usei Jquery pra adicionar uma nova linha com um "id" e "name" diferente a cada linha. Depois no Controller eu peguei a quantidade de campos e dividi por 2 que são a quantidade de campos criados a cada linha. fiz um for que mostra a cada iteração um nome e uma idade. agora é só mudar para seus valores aí.

<body>

<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-6 jumbotron">
            <form action="/dinamicForm" method="POST">
            @csrf
                <div class="line">
                    <div class="form-group">
                        <label for="nome">Nome</label>
                        <input type="text" id="nome" name="nome_0" class="form-control" >
                    </div>
                    <div class="form-group">
                        <label for="idade">Idade</label>
                        <input type="text" id="idade" name="idade_0" class="form-control" >
                    </div>
                </div>
                <div class="form-group">
                    <button id="create-new-line" class="btn btn-info">Criar nova Linha</button>
                    <button type="submit" id="send-form" class="btn btn-info">Enviar Formulário</button>
                </div>
            </form>
        </div>
    </div>
</div>

    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>

No Jquery

cont = 0;
$('#create-new-line').on("click", function(e){
   cont ++;
   var content =
   '<div class="form-group">' + 
     '<label for="nome-' + cont + '">Nome</label>' + 
     '<input type="text" class="form-control" id="nome-' + cont + '" name="nome_' + cont + '" >'+
   '</div>' +
   '<div class="form-group">' + 
     '<label for="idade-' + cont + '">Idade</label>' + 
     '<input type="text" class="form-control" id="idade-' + cont + '" name="idade_' + cont + '" >'+
   '</div>';
   $('.line').append(content);
   e.preventDefault(e);
});

e no Controller

$qtd = (count($values) / 2);

$x = 0;
   for($x = 0; $x<$qtd; $x++){
      $nome_linha = "nome_$x";
      $idade_linha = "idade_$x";
      echo '--------------------------------------<br>';
      echo "Nome: " . $$nome_linha . "<br>";
      echo "Idade: " . $$idade_linha . "<br>";
   }
echo '--------------------------------------<br>';

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .