2

Bom a primeira vista, o título já demonstra o erro, porém esse é o processo que necessito mas não tenho ideia de como executá-lo.

Dado um form simples por exemplo:

<form method="post" action="trata_form.php">
    <input type="text" placeholder="Insira sua cor"/>
    <button type="submit">Add</button></br></br>
    <input type="checkbox" value="vermelho"/>Vermelho</br>
    <input type="checkbox" value="vermelho"/>Azul</br>
    <input type="checkbox" value="vermelho"/>Branco</br>
    <input type="submit" value="Envia Form"/>
</form>

A ideia é que quando o user clique no botão após inserir uma nova cor, essa ação irá inserir a nova cor na tabela de cores e através de um ajax o form será atualizado com um checkbox contendo a nova cor. Até ai ok.

A dúvida é se essa ação(clicar no botão para adicionar nova cor) deve ocorrer através de um "action" ? se sim como eu devo proceder, pois o "action" do form já está presente, no entanto este só deve "agir" após a nova cor ter sido inserida e apresentada.

Não é necessário um código pronto, apenas uma caminho para eu compreender como solucionar esse processo.

Desde já, tks!

10
  • Não sei se entendi corretamente. Mas, se existem dois campos (um para adicionar e outro para escolher), então poderia ter dois forms distintos. Um para adicionar uma cor, outro para escolher a cor. Mas, de qualquer forma a ação do ajax é independente de form. Então você pode fazer a chamada ao clicar no botão, assim obtêm o dado digitado e envia.
    – Inkeliz
    Commented 22/08/2016 às 20:36
  • @Inkeliz obrigado pela atenção, assim... Esse form é um form grande, dividido em partes através de includes. Essa parte da cor ( esse é só um exemplo, são características na verdade) é um include que está contido em um modal... Eu posso inserir um novo form dentro desse modal que já é parte de um form?
    – MagicHat
    Commented 22/08/2016 às 20:42
  • @Inkeliz minha dificuldade, está nessa inserção da nova "cor " na tabela de cores, uma vez que a forma que eu conheço é através de um action, no entanto eu tentei colocar form dentro de form (o que acredito não ser possível) e esse botão "Add"(que é um submit) acionou o action do form primário, saca...
    – MagicHat
    Commented 22/08/2016 às 20:45
  • Quando tem o AJAX, não necessariamente precisa de um FORM, apenas a manipulação de eventos já se consegue fazer. Isso não ajudaria? Commented 22/08/2016 às 20:46
  • @WilliamAparecidoBrandino e com o ajax eu conseguiria inserir a nova cor na tabela? Desculpe se a pergunta parece boba, mas realmente não manjo muito, mas se disser que dá eu me viro...
    – MagicHat
    Commented 22/08/2016 às 20:47

1 Resposta 1

2

Não sei se fui claro na resposta. Só pra exemplificar de forma bem improvisada:

<form method="post" action="trata_form.php">
    <input id="nova-cor" type="text" placeholder="Insira sua cor"/>

    <button id="add-cor" type="button">Add</button></br></br>

    <div id="cores">
        <input type="checkbox" value="vermelho"/>Vermelho</br>
        ...     
    </div>
    <input type="submit" value="Envia Form"/>
</form>
<script>
$("#add-cor").on("click", function(){
    var novacor = $("#nova-cor").val();
    $.ajax({
        ...chame aqui a url para adição da nova cor
    }).done(function() {
        $("#cores").append...
    });
});
</script>
1
  • Clareou legal man, tks!
    – MagicHat
    Commented 22/08/2016 às 21:39

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 .