+2

Simulando Remote Data Services com PHP e JavaScript

criado por Daniel Batista Lemes em 11/09/2003 8:35pm
Aqui irei mostrar como simular o RDS (Remote Data Services) do ASP, que permite fazer consultas no servidor sem dar reload na página, o que é uma grande dificuldade dos sistemas baseados na Web.

A técnica consiste em usar um frame escondido para executar as consultas e enviar as respostas para o frame principal. Como isso é feito ? Veja abaixo para um exemplo bem simples.

<html>
<head>
<title> Home Page </title>
</head>
<frameset cols="100%,0%">
<frame src="index2.php" name="principal">
<frame src="nada.php" name="escondido">
</frameset>
</html>

O código acima é da página com frames. Se tentarem ver essa página no netscape vão ver que o frame não esta escondido (mas no Internet Explorer ele está) mas essa não foi a minha maior preocupação.

Agora vamos ao código da página index2.php que é a principal. Ao analizar o código podemos notar que temos a função alerta() que avisa que a senha e/ou usuário estão errados, que será chamada se for necessário.

<html>
<head>
<title></title>
<script language="JavaScript" type="text/JavaScript">
<!--
function alerta() {
  alert ("senha/usuario não encontrado");
}

function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>
</head>

<body>
<div id="Layer1" style="position:absolute; left:186px; top:171px; width:362px; height:53px; z-index:1; visibility: hidden;">
<div align="center"><font color="#0066FF" size="5">Aguarde Validando ...</font></div>
</div>
<form method="post" action="consulta.php" target="escondido">
senha:<input type="text" name=senha size="20">
<input type="submit" onClick="MM_showHideLayers('Layer1','','show');" value="Botão" >
</form>
</body>
</html>

Abaixo temos o código do frame escondido.

<?php
if ($senha == "teste") {
?>
<script language="JavaScript">
<!--
parent.principal.location.replace("sucesso.html");
//-->
</script>
<?php
} else {
?>
<script language="JavaScript">
<!--
parent.principal.alerta();
parent.principal.MM_showHideLayers('Layer1', '', 'hide');
//-->
</script>
<?php
}
?>

Vocês podem ver que o sistema é bastante simples, mas isso minimiza os reloads, dando uma melhor impressão no sistema. Espero que tenham gostado e em breve estarei colocando aqui como fazer arrays dinâmicos usando a mesma técnica.

Comentários:

Mostrando 1 - 10 de 17 comentários
<script>alert('teste');</script>
29/10/2003 7:48am (~21 anos atrás)

Eu tenho utilizado iframe em alguns sites de busca imovies. De uma olhada neste:
http://www.mercoplus.com/incguanabara/busca/index.php?F_TipoTran=Venda&F_Imoveldotipo=Casa&detalhes=Enviar

Na parte de Estado->Cidade->Bairro.

De uma olhadinha.
20/10/2003 11:07am (~21 anos atrás)

Gostei bastante do artigo, postado!
É um recurso muito bom que merece ser estudo.
13/10/2003 1:34pm (~21 anos atrás)

Estou preparando um exemplo simples, e estarei apresentando-o no site.

Estou terminando e logo após enviarei para o Grupo a receita de bolo.

Este recurso é muito bom... Acho que será de grande benefício para todos...

02/10/2003 3:20pm (~21 anos atrás)

Eu também já utilizei JSRS faz um bom tempo.
Ele é bom, porém, podemos simplicar utilizando a combinação XML-DOM, PHP e JavaScript.

O XML é nativo no Browser, ou seja, se vc criar um parser, poderá facilmente atualizar dados na página e receber o resultado em formato XML. Desta forma será possível atualizar sem refresh.

Depois que conheci o XML-DOM com JavaScript, fiz uma receitinha de bolo que é pratica...

E o bom sem nenhuma atualização de página (refresh)

Quem quiser posso enviar um exemplo prático muito utilizado, é só passar um e-mail para mim.
02/10/2003 11:56am (~21 anos atrás)

Agnus Day disse:
Esta eh uma tecnica q jah uso faz um tempaum.
Outra q vc pode fazer eh usar iframes dentro de layers ocultos.
Uso muito isto em aplicacoes web que desenvolvo para industria e lojas.
E aplicando uma boa folha de estilos, usando tb janelas pops ou showmodal (este ultimo soh para IE5.5+) se consegue um visual e interativida taum real quanto delphi.
Muita gente pergunta se meus sistemas saum feitos em delphi.
Existem componentes q ajudam muito, como listgrid, controlpane, e outros mais q podem ser encontrados na web de graça.
eh soh ter um conhecimento razoavel em javascript.
quem quiser alguma coisa eh so me passar um email.
24/09/2003 7:22pm (~21 anos atrás)

a disse:
além disso, esses layers podem ser posicionados, usando CSS!

Muito inteligente e prático...
24/09/2003 11:40am (~21 anos atrás)

a disse:
Apesar do conhecer pouco sobre Java, gostei muito!!

Vou procurar saber mais sibre o assunto!
21/09/2003 1:39pm (~21 anos atrás)

Miguel Lohan disse:
Bem legal.
19/09/2003 1:58pm (~21 anos atrás)

pode ser usadas Iframes
17/09/2003 8:17am (~21 anos atrás)

Novo Comentário:

(Você pode usar tags como <b>, <i> ou <code>. URLs serão convertidas para links automaticamente.)