Código bem simples e útil para a galera que gosta de usar AJAX e não tem muita referência!
Página para carregar o AJAX, funcionalidades:
ajaxCarregar.js
function GetXMLHttp() {
if(navigator.appName == "Microsoft Internet Explorer") {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else {
xmlHttp = new XMLHttpRequest();
}
return xmlHttp;
}
var Enviar = GetXMLHttp();
// Início - Cadastro
function CadastrarDados() {
var Nome = document.getElementById("Nome");
var EMail = document.getElementById("EMail");
var URL = "Cadastro.asp?Cadastrar=Ok&Nome="+Nome.value+"&EMail="+EMail.value+"";
Enviar.open("GET", URL, true);
Enviar.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
document.getElementById("Resposta").innerHTML = "Cadastrado com Sucesso!!!";
Nome.value = "";
EMail.value = "";
Enviar.send(null);
Enviar.onload = lerTexto;
}
// Final - Cadastro
// Início - Deletar
function apagar(id, rowIndex) {
if (confirm('Tem certeza que deseja excluir este registro?')) {
document.getElementById("tabela").deleteRow(rowIndex);
Enviar.open("POST",'Cadastro.asp?Deletar=Ok&id='+ id, false);
Enviar.send(null);
}
}
// Final - Deletar
// Início - Carregar Página
function lerTexto() {
var URLler = "Ler.asp";
Enviar.onreadystatechange = stateChanged;
Enviar.open("GET", URLler, true);
Enviar.send(null);
}
function stateChanged() {
if (Enviar.readyState==4) {
document.getElementById("ler_Dados").innerHTML = Enviar.responseText;
}
}
window.onload = lerTexto;
// Final - Carregar Página
Ler.asp
<%@ Language="JavaScript" %>
<%
var Conexao;
var Conexao = Server.CreateObject("Adodb.Connection");
Conexao.ConnectionString = "Driver=MySQL ODBC 3.51 Driver; DataBase=banco; Server=localhost; Uid=root; PassWord=root;";
Conexao.Open;
%>
<table width="407" border="1" cellspacing="0" cellpadding="0" id="tabela">
<tr>
<td width="164"><strong>NOME</strong></td>
<td width="159"><strong>EMAIL</strong></td>
<td width="76"><strong>Acionar</strong></td>
</tr>
<%
var rs = Conexao.Execute("Select * From Teste");
if (rs == null) {
Response.Write("NADA");
}
else {
while (!rs.EOF) {
%>
<tr>
<td><%=rs("Nome")%></td>
<td><%=rs("EMail")%></td>
<td><a href="#" onClick="apagar('<%=rs("Codigo")%>', this.parentNode.parentNode.rowIndex);">deletar</a></td>
</tr>
<%
rs.MoveNext();
}
}
%>
</table>
Cadastro.asp
<%@ Language="JavaScript" %>
<%
var Conexao;
var Conexao = Server.CreateObject("Adodb.Connection");
Conexao.ConnectionString = "Driver=MySQL ODBC 3.51 Driver; DataBase=banco; Server=localhost; Uid=root; PassWord=root;";
Conexao.Open;
%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Cadastrar</title>
<script language="javascript" src="ajaxCarregar.js"></script>
</head>
<body>
<div id="Resposta"></div><br>
<form id="Form">
Nome: <input type="text" id="Nome" name="Nome" value=""><br>
E-Mail: <input type="text" id="EMail" name="EMail" value=""><br>
<input type="button" id="Cadastrar" value="Cadastrar" name="Cadastrar" onClick="CadastrarDados();">
</form><br>
<br>
<br>
<div id="ler_Dados"></div>
</body>
</html>
<%
if (Request.QueryString("Cadastrar") == "Ok") {
Conexao.Execute("Insert Into Teste (Nome, EMail) Values ('"+Request.QueryString("Nome")+"', '"+Request.QueryString("EMail")+"')");
Response.Write("");
}
if (Request.QueryString("Deletar") == "Ok") {
Conexao.Execute("Delete From Teste Where Codigo = '"+Request.QueryString("id")+"'");
Response.Write("");
}
%>
