Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Ted k'

Usando o jQuery para cadastrar dados

Recommended Posts

A linguagem em si para fazer o cadastramento no banco não é o foco no momento, usei ASP com JScript para isso e usei o jQuery com efeito .fadeIn("slow"); para isso então vamos lá:

 

Criei um arquivo chamado funcao_jquery.js para colocar a função de efeito do jQuery:

 

O Script completo e comentado para ter uma idéia de como funciona:

 

funcao_jquery.js

$(document).ready(function(){
	$('#btn_enviar').click(function(){
		// Pega valor dos campos Nome e E-Mail
		var nome_post = $('#Nome').val();
		var email_post = $('#EMail').val();
		// Envia para a função criada em ASP
		$.post("Cadastro_JQuery.asp?Cadastrar=Ok",{nome: nome_post, email: email_post},function(){
			// Lista dentro de uma UL>LI os dados postados
			$("ul li:last").after("<li>" + nome_post + " : " + email_post + "</li>").next().fadeIn("slow");
		});
		 // Apaga os Dados do Campo Nome e E-Mail
		$('#Nome').val("");
		$('#EMail').val("");
		
	return false;
	});
});

Na tela inicial temos esse modelo aqui com campo de Nome e E-Mail só para exemplo:

Imagem Postada

 

Quando você cadastra ele gera uma LI dinamicamente sem refresh e com efeito fade:

Imagem Postada

 

Segue o código completo:

<%@ Language="JavaScript" %>
<%
// Conexao com o Banco de Dados
var Conexao = Server.CreateObject("Adodb.Connection");
Conexao.ConnectionString = "Driver=MySQL ODBC 3.51 Driver; DataBase=paineldevendas13; Server=localhost; Uid=root; PassWord=root;";
Conexao.Open;
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>JQuery Cadastrando com ASP</title>
<script language="javascript" src="jquery.js"></script>
<script language="javascript" src="funcao_jquery.js"></script>
</head>
<body>
<h2>JQuery Cadastrando com ASP</h2>
<ul>
<%
var rs = Conexao.Execute("Select * From Teste"); // SQL para listar os dados
if (rs == null) {
	Response.Write("NADA ENCONTRADO");
}
else {
	while (!rs.EOF) {
		Response.Write("<li>"+rs("Nome")+" : "+rs("EMail")+"</li>") // Lista todos os cadastrados do banco
	rs.MoveNext();
	}
}
%>
</ul>

<br><strong>INSIRA DADOS NO BANCO</strong><br>

<form action="Cadastro_JQuery.asp?Cadastrar=Ok" method="post">
	Nome: <input name="Nome" type="text" id="Nome" />
	<br>
	E-Mail: <input name="EMail" type="text" id="EMail" />
<input name="btAdd" type="submit" value="adicionar" id="btn_enviar" />
</form>
</body>
</html>
<%
// Função para cadastrar no banco
if (Request.QueryString("Cadastrar") == "Ok") {	
	Conexao.Execute("Insert Into Teste (Nome, EMail) Values ('"+Request.Form("Nome")+"', '"+Request.Form("EMail")+"')");
	Response.Write("");
}
%>

Baixar : jquery-1.2.6.js

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ted'k tá funcionando perfeitamente ?. Não entendi essa estrutura de { }, parece q a estrutura é PHP explica ai testei e deu erro exatamente nessa estrutura e tbm nos ; ponto e virgula abraço

Compartilhar este post


Link para o post
Compartilhar em outros sites

Jow, ele usou Javascript e não VBScript.

 

 

 

Boa jovem Ted k'. JQuery dominando haha.

Compartilhar este post


Link para o post
Compartilhar em outros sites

é que estou usando ASP com JScript e não ASP com VBScript como hargoniado citou!

 

hargon, coloquei aqui no fórum de ASP para a galera ver a interação com ASP como é simples, mais lá no fórum de javascript tem mais exemplos!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.