Diferença entre <input type = 'button' /> e <input type = 'submit' />

Não existe uma pergunta estúpida, então vamos lá: Qual é a diferença entre <input type='button' />e <input type='submit' />?

<input type="button" />Os botões não enviarão um formulário - eles não fazem nada por padrão. Eles geralmente são usados ​​em conjunto com JavaScript como parte de um aplicativo AJAX.

<input type="submit"> Os botões enviarão o formulário em que estão quando o usuário clicar neles, a menos que você especifique o contrário com JavaScript.

Um 'botão' é apenas isso, um botão, ao qual você pode adicionar funcionalidades adicionais usando Javascript. Um tipo de entrada 'enviar' tem a funcionalidade padrão de enviar o formulário em que ele foi inserido (embora, é claro, você ainda possa adicionar funcionalidades adicionais usando Javascript).

O botão não envia o formulário sozinho. É um botão simples usado para executar alguma operação usando javascript, enquanto o Submit é um tipo de botão que, por padrão, envia o formulário sempre que o usuário clica no botão Enviar.

O IE 8, na verdade, usa o primeiro botão encontrado ou o botão enviar. Em vez de indicar facilmente o que é desejado, tornando-o um tipo de entrada = enviar o pedido na página é realmente significativo.

Também deve ser mencionado que uma entrada nomeada de type = "submit" também será enviada juntamente com os campos nomeados do outro formulário, enquanto uma entrada nomeada de type = "button" não será.

Com outras palavras, no exemplo abaixo, a entrada nomeada name=button1 NÃO será enviada enquanto a entrada nomeada name=submit1 será enviada.

Exemplo de formulário HTML (index.html):

<form action="checkout.php" method="POST">

  <!-- this won't get submitted despite being named -->
  <input type="button" name="button1" value="a button">

  <!-- this one does; so the input's TYPE is important! -->
  <input type="submit" name="submit1" value="a submit button">

</form>

O script PHP (checkout.php) que processa a ação do formulário acima:

<?php var_dump($_POST); ?>

Teste o acima em sua máquina local criando os dois arquivos em uma pasta chamada / tmp / test / e executando o servidor da Web PHP embutido no shell:

php -S localhost:3000 -t /tmp/test/

Abra seu navegador em http: // localhost: 3000 e veja por si mesmo.

Alguém poderia se perguntar por que precisamos enviar um botão nomeado? Depende do script de back-end. Por exemplo, o plug-in WooCommerce WordPress não processará uma página do Google Checkout, a menos que o Place Orderbotão nomeado também seja enviado. Se você alterar o tipo de enviar para o botão , esse botão não será enviado e, portanto, o formulário do Google Checkout nunca será processado.

Provavelmente este é um pequeno detalhe, mas você sabe, o diabo está nos detalhes.

<input type="button">pode ser usado em qualquer lugar, não apenas no formulário e eles não enviam o formulário se estiverem em um. Muito mais adequado Javascript.

<input type="submit">deve ser usado apenas em formulários e eles enviarão uma solicitação (GET ou POST) para o URL especificado. Eles não devem ser colocados em nenhum local HTML.

O W3C deixa claro, na especificação sobre o elemento Button

O botão pode ser visto como uma classe genérica para todos os tipos de botões sem comportamento padrão.

W3C

type='Submit'está definido para encaminhar e obter os valores em BACK-END (PHP, .NET etc.). type='button'refletirá o comportamento normal do botão.