Agência OFF, desenvolvimento de soluções web para as Agências Digitais
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("");
}
%>
Agência OFF, desenvolvimento de soluções web para as Agências Digitais
E ae fera blz.. seguinte .. baixei seu codigo aq .. ta rodando blz .. mas ele nao exclui fera ..oq faço.´flw
O que aconteceu?
Erro no AJAX, pode debugar?
Erro no ASP?
Olá amigo, parabéns pelo post. Só para constar o erro que o Fabio citou, basta colocar na página ‘ler.asp’ o script ‘ajaxCarrega.js’ que ficou faltando. Grande abraço!
bela observação amigo!!
Cara, pode tirar algumas dúvidas? adaptei minha necessidade ao seu codigo. Mudei por exemplo a conexao, pois me conecto em SQL SERVER. O erro que esta dando é na linha 26 do ajaxCarregar onde aparece “Enviar.onload = lerTexto;” pode me ajudar o que pode estar acontecendo?
obrigado
Pegue a página Ler.asp que coloquei e teste separadamente para ver se está listando corretamente
não estava… estava faltando um campo na minha tabela. Já criei, e agora ele esta lendo direitinho. porém quando entro em cadastra.asp ele nao apresenta os valores lá e continua dando problema no mesmo lugar.
o código esta no ar no endereço http://www.cursoyes.com.br/siga/estudos/ajax/cadastra.asp
pode testar o LER separadamente nesse endereço.
deu erro amigo:
Microsoft JScript runtime error ’800a1391′
‘Conexao’ is undefined
/siga/estudos/ajax/Ler.asp, line 16
veja no firefox
esta funcionando no firefox, mas não deleta. Ele chega a deletar visualmente, mas aparece novamente quando incluo outro. no IE nao aparece a listagem abaixo. Pode testar novamente, já acertei.
te informando:
testei em 4 browsers:
IE8: Não apaga; não chega a voltar para o CADASTRA.ASP?DELETAR=OK.
FIREFOX: situação idêntica ao do IE8.
CHROME: Apaga, mas depois de apagar ele Duplica o formulario logo abaixo do primeiro e não mostra a lista e depois se confunde todo.
SAFARI: situação idêntica ao do CHROME.
Estranho, peguei esse mesmo codigo e em nenhum dos navegadores deu erro, só não testei no IE8 pois não tenho
pode ser o banco de dados?
não, mande seu codigo zipado para algum lugar que baixo e vejo ele!
manda seu email pra mim: leobil@gmail.com
adamisongs@gmail.com
http://www.cursoyes.com.br/siga/estudos/ajax/ajax.rar
Boa tarde,
eu fiz tudo e deu ok, prém veio uma dúvida sobre atualização. A linha document.getElementById(“demoTable”).UpdateRow(rowIndex); apaga a linha da tabela. Aí peguei a mesma função e fiz para atualizar um registro, só que não quero apagar a linha, e sim somente atualizar a linha
atualizar seria a mesma função que cadastrar, a diferença fica no SQL, faça o teste
Boa noite, a função eu peguei a mesma que vc utilizou para deletar, e está funcionando 100%. A dúvida seria com o Método javascript utilizado. Quando vc apaga utiliza o metodo deleteRow, não teria um UpdateRow()?
Eu comentei a linha do deleteRow, e quando atualiza fica na mesma, não mostra nada, mas se eu clicar em f5, aí sim mostra a atualização.
Bom dia, na verdade eu quero atualizar a partir de um link igual ao link deletar.
Obrigado pela ajuda, já resolvi!
Bom dia, ótimo script Ted, porém estou com um probleminha, quando insiro algo novo a informação nova cadastrada já não atualiza no formulário de forma instantanea, só quando carrego novamente, o que pode ser isso? pode me ajudar?
Gostaria de saber se pode me ajudar, estou criando um site, e gostaria que a manutenção das fotos fosse de forma mais simples e facil para qualquer um mecher (incluir e excluir) e creio que a melhor linguagem seria asp, porem não sei como fazer???? Estou com o site pronto, mas não sei como prosseguir???? Preciso de ajuda e pago por isso. Se puder entre em contato comigo no fone 96859202. Obrigada. Angela
Como seria a conexão para o BD em Access?
Grato desde já.