Simples Formulário Com HTML, jQuery, Ajax e PHP

Receba em primeira mão, e com prioridade, os conteúdos Android exclusivos do Blog. Você receberá um email de confirmação. Somente depois de confirma-lo é que poderei lhe enviar os conteúdos exclusivos.

Email inválido.
Blog /Desenvolvimento Web /Simples Formulário Com HTML, jQuery, Ajax e PHP

Simples Formulário Com HTML, jQuery, Ajax e PHP

Vinícius Thiengo
(9177) (3) (1) (1)
Go-ahead
"Você tem sonhos, então a vida bate em você para saber: 'você realmente quer isso?'"
Eric Thomas
Kotlin Android
Capa do livro Desenvolvedor Kotlin Android - Bibliotecas para o dia a dia
TítuloDesenvolvedor Kotlin Android - Bibliotecas para o dia a dia
CategoriasAndroid, Kotlin
AutorVinícius Thiengo
Edição
Capítulos19
Páginas1035
Acessar Livro
Treinamento Oficial
Android: Prototipagem Profissional de Aplicativos
CursoAndroid: Prototipagem Profissional de Aplicativos
CategoriaAndroid
InstrutorVinícius Thiengo
NívelTodos os níveis
Vídeo aulas186
PlataformaUdemy
Acessar Curso
Receitas Android
Capa do livro Receitas Para Desenvolvedores Android
TítuloReceitas Para Desenvolvedores Android
CategoriaDesenvolvimento Android
AutorVinícius Thiengo
Edição
Ano2017
Capítulos20
Páginas936
Acessar Livro
Código Limpo
Capa do livro Refatorando Para Programas Limpos
TítuloRefatorando Para Programas Limpos
CategoriaEngenharia de Software
AutorVinícius Thiengo
Edição
Ano2017
Capítulos46
Páginas599
Acessar Livro
Quer aprender a programar para Android? Acesse abaixo o curso gratuito no Blog.
Conteúdo Exclusivo
Receba em primeira mão, e com prioridade, os conteúdos Android exclusivos do Blog.
Email inválido

Então, nesse vídeo mostro como criar um formulário utilizando as tecnologia HTML, jQuery, Ajax e PHP. É bem simples, mas eu foquei no entendimento. É muito importante que você saiba o que acontece quando algum usuário envia um formulário via Ajax, por isso o vídeo ficou um pouco comprido.

Eu acabei me confundindo no final com um erro de script, mas foi corrigido no vídeo mesmo. Coisas que acontecem quando a filmagem é na vera (eu já tinha feito todo o percurso anteriormente para ter o script bem definido!).

O link de demonstração está ai abaixo do post.

O arquivo com o projetinho está disponível para download logo ai embaixo no post.

Para instalar o AppServ acesse o link a seguir: AppServ (eu utilizo a versão 2.5.10 do AppServ).

Se divirta, evolua.

Receba em primeira mão, e com prioridade, os conteúdos Android exclusivos do Blog.
Email inválido

Relacionado

Faça certo: Redirecionamento 301 em PHPFaça certo: Redirecionamento 301 em PHPDesenvolvimento Web
O que acho de SEO (Search Engine Optimization)O que acho de SEO (Search Engine Optimization)Desenvolvimento Web
Preço de Software: Estratégias Para Negociar Com Clientes PechincheirosPreço de Software: Estratégias Para Negociar Com Clientes PechincheirosEmpreendedorismo
Projeto ClientesCar: Conhecendo o Projeto e Instalando o AppServProjeto ClientesCar: Conhecendo o Projeto e Instalando o AppServDesenvolvimento Web

Compartilhar

Comentários Facebook

Comentários Blog (3)

Para código / script, coloque entre [code] e [/code] para receber marcação especifica.
Forneça seu nome válido.
Forneça seu email válido.
Forneça o comentário.
Enviando, aguarde...
fabio ruivo (1) (0)
27/11/2018
muito util seu codigo, mas preciso de uma ajuda...
nesse codigo inclui um campo <select id="opcao"> e coloquei um botão modal para incluir novo item desse <select> . a inclusão do banco de dados funcionou perfeitamente, porem, preciso de uma ajuda para esse campo select ter um reload e puxar os itens do banco de dados e com isso será atualizado o meu insert
Responder
Vinícius Thiengo (0) (0)
02/12/2018
Fabio, tudo bem?

Veja se você consegue seguir o roteiro abaixo em código front-end (JavaScript / jQuery - Ajax) e em código back-end:

-> 1 - Assim que houver a inserção do novo item em back-end, retorne um valor informando sobre o sucesso (1) ou o não sucesso (0) da inserção;

-> 2 - Em caso de sucesso (retorno 1), acesse o <select id="opcao"> pelo código jQuery e então trave ele com disabled="true";

-> 3 - Logo depois acione um novo código Ajax que se comunicará com um trecho do back-end para que este trecho acesse a parte do banco de dados que tem todas as opções que têm de estar no <select>, incluindo a nova opção adicionada no item um, via tela modal. Esse trecho back-end deverá retornar os itens do <select> já formatados, cada um dentro de tags <option>;

-> 4 - Com o retorno das opções via back-end, apenas acesse o <select id="opcao">, coloque como conteúdo dele as novas tags <option> e então mude o disabled para disabled="false".

Fabio, dessa forma você conseguirá a atualização do <select> assim que houver a adição (ou remoção) de algum item.

Abraço.
Responder
03/10/2017
muito bom, obrigado por compartilhar seu conhecimento
Responder