Blog /Desenvolvimento Web /Simples Formulário Com HTML, jQuery, Ajax e PHP

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

Vinícius Thiengo
(15331) (4)

Go-ahead

"O método consciente de tentativa e erro é mais bem-sucedido que o planejamento de um gênio isolado."

Peter Skillman

Prototipagem Android

Capa do curso Prototipagem Profissional de Aplicativos

TítuloAndroid: Prototipagem Profissional de Aplicativos
CategoriasAndroid, Design, Protótipo
AutorVinícius Thiengo
Vídeo aulas186
Tempo15 horas
ExercíciosSim
CertificadoSim

Acessar Curso

Quer aprender a programar para Android? Acesse abaixo o curso gratuito no Blog.

Curso Android, gratuito

Lendo

TítuloDomain-driven Design Destilado
CategoriaEngenharia de Software
Autor(es)Vaughn Vernon
EditoraAlta Books
Edição1ª
Ano2024
Páginas160

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.

Demo

Página de demonstração

Download

Download do arquivo .zip com os arquivos do vídeo.

Relacionado

Faça certo: Redirecionamento 301 em PHPDesenvolvimento Web

O que acho de SEO (Search Engine Optimization)Desenvolvimento Web

Preço de Software: Estratégias Para Negociar Com Clientes PechincheirosEmpreendedorismo

Projeto ClientesCar: Conhecendo o Projeto e Instalando o AppServDesenvolvimento Web

Comentários Facebook

Comentários Blog (4)

Bruno (0) (0)

12/11/2021

Valeu

Responder

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

mayron (1) (0)

03/10/2017

muito bom, obrigado por compartilhar seu conhecimento

Responder