Troca De Layers

[fagundao]

Amigos,

Tenho um script para fazer a troca de layers em uma pagina, queria usa-lo em um cadastro e esse scriptit faria a troca das abas do cadastro, que contem os dados pessoais, comerciais, cobrança - cada uma dessas categorias estaria em uma layer.

Só que quando preencho o formulário da layer dados pessoais e depois mudo para a layer dados comerciais adiciono os dados e quando retorno para layer de dados pessoais esta tudo em branco.

vocês sabem como posso mater os dados quando trocar de camada

PS. uso PHP e MySQL para efetuar o cadastro.

esse é o script, mas eu não entendo nada de javaScript

<script type="text/javascript">

// onresize for ns4

var origWidth, origHeight;

if (document.layers)

{

  origWidth = window.innerWidth; origHeight = window.innerHeight;

  window.onresize = function() {if (window.innerWidth != origWidth || window.innerHeight != origHeight) history.go(0);}

}

var cur_lyr; // holds id of currently visible layer

function getCoor(imgId)

{

  var d = document;

  var x = (d.layers)?d[imgId].x:d[imgId].offsetLeft;

  var y = (d.layers)?d[imgId].y:d[imgId].offsetTop;

  return x;

}

function inverte(alvo)

{

  document.getElementById('lCases').innerHTML = document.getElementById(alvo).innerHTML;

}

function swapLayers(id)

{

  //var c = getCoor(document.getElementById('imgLogo'));

  //var c = document.elements.imgLogo;

  //alert(document.getElementById('teste').style.z-index);

  if (cur_lyr) hideLayer(cur_lyr);

  showLayer(id);

  cur_lyr = id;

}

function showLayer(id)

{

  var lyr = getElemRefs(id);

  if (lyr && lyr.css) lyr.css.visibility = "visible";

}

function hideLayer(id)

{

  var lyr = getElemRefs(id);

  if (lyr && lyr.css) lyr.css.visibility = "hidden";

}

function getElemRefs(id)

{

  var el = (document.getElementById)? document.getElementById(id): (document.all)? document.all[id]: (document.layers)? document.layers[id]: null;

  if (el) el.css = (el.style)? el.style: el;

  return el;

}

</script>

para exibir as layers:

<div id="lCases" name="lCases">

</div>

para mudar as layers faço:

<a href="javascript: inverte('Tab1')">

obrigado

[Crystian]

Cara uma solução pra isso seria você criar um formulário com todos os campos, das três abas e apartir dela, mostrar somente o que for daquela aba, assim você não perde o q tem nos values delas. você teria que trabalhar com div's com visibility = hidden...

Não sei se tu me entendeu...

[fagundao]

To fazendo o seguinte,

Criei um formulario e depois criei as div´s

<form method="POST" action="add_cadastro.php">

<div id="Tab1">

... dados da primeira aba

</div>

<div id="Tab2">

... dados da segunda aba

</div>

<div id="Tab3">

... dados da terceira aba

</div>

<input type="img" src="bt_ok.gif">

</form>

estou usando o print_r para imprimir o conteudo do POST na pagina add_cadastro.php e esta tudo em branco, e tb continua não aparecendo os dados quando troco de layer.

é assim q deveria fazer?

[olimpia]

Na pagina do yahoo tem um esquema deste tipo

Neste link tambem tem um esquema que usa aba

qualquer coisa posta ai

[fagundao]

É desse tipo sim!

quando troco de aba não perde o que esta no formulário.

[Crystian]

tu vai mostrar somente um div por vez não é??

[fagundao]

isso!

[olimpia]

cada aba sera um div, sendo que ao ser clicado na aba todos os divs ficaram ocultos, menos o da aba que você clicou

Ou seja, o conteudo da pagina não será alterado e sim oculto

[fagundao]

Bom, ai e que esta o detalhe.

O conteudo é alterado, a pagina carrega com os dados do cliente e ele faz as alterações necessárias quando mudar de aba não altera nada vai ocultar a primeira mas tera que mater os dados que o cliente alterou, e exibir os dados da segunda.

Quando eu voltar para primeira os dados que o cliente alterou deverão aparecer, e não os dados iniciais (carregados na pagina inicialmente pois estão no value dos inputs)

[olimpia]

Mas é isso que acontece

Por exemplo, tenho duas abas, sendo que na 1º tem dois input e na 2º somente um texto informativo

Quando a pagina e carregada os input da 1º aba vem como o valor "texto", eu mudo os para "leandro" e clico na 2º aba

quando clica na 1º aba novamente, o valor dos input sera "leandro", posi a pagina não foi atualizada

É isso que você quer fazer?

[fagundao]

é isso sim, o exemplo do yahoo é perfeito, vou quebrar um pouco a cabeça para entender e qualquer coisa eu posto

Muito obrigado

[Crystian]

fiz um exemplo pra ti.... vê se te ajuda...

<html>
<head>
<script>
function mostra(id) {
    for (i=0; i < document.getElementsByTagName('div').length; i++) {
     document.getElementsByTagName('div')[i].style.visibility = 'hidden';
    }
    document.getElementById(id).style.visibility = 'visible';
}
</script>
<style>
.div {
position: absolute;
width: 100;
height: 100;
visibility: hidden;
}
</style>
</head>
<body>
<a href="javascript:mostra('div1');">div1</a> &nbsp;<a href="javascript:mostra('div2');">div2</a>
<form name="form">
<div id="div1" class="div" style="visibility: visible;">
<input type="text" name="texto1">
<input type="text" name="texto2">
<input type="text" name="texto3">
</div>
<div id="div2" class="div">
<input type="checkbox" name="checkbox1">
<input type="checkbox" name="checkbox2">
<input type="checkbox" name="checkbox3">
</div>
</form>
</body>
</html>

Abraço

Crystian

[olimpia]

isso mesmo, eu fiz +/- assim, mas usei uma table, com somente uma linha e cada aba é uma coluna

Ai quando a mesma é clicada eu trabalho com as bordas, ou seja, da impressão que a aba esta ligada com o div

[Crystian]

Mas dá pra fazer com table essa maneira q mostrei, o efeito independe do funcionamento, você pode muito bem colocar dentro de uma table e trabalhar com as bordas esse meu exemplo sem mexer na funcionalidade... Vamos ver se conseguimos ajudar nosso amigo fagundao...

Abraço

[fagundao]

[Crystian]

cara o método document.getElementsByTagName() pega somente as tags html, não adianta trocar para "camada".... se você trocou para camada vai ter que fazer diferente. Utilize o document.getElementsByName('camada') e coloca a propriedade name la nos div's...

Tenta fazer qualquer coisa posta ae...

Abraço

Crystian

[fagundao]

Pô! valeu mesmo!!

Agora ta tudo funcionando do jeito que eu queria.

ae pra eu não perturbar vocês com perguntas idiotas como esta ultima você me indica algum livro para eu poder estudar sobre o assunto.

[]´s fagundao

Um Feliz Ano novo para todos!!!!!!!!!

[Crystian]

Não é incômodo cara, bom livro o único q utilizo para tirar dúvidas é a Biblia do JavaScript da editora Campus. existe um site muito bom tb com exemplos só que é em inglês http://www.w3schools.com se você se der bem com o inglês vai gostar do site...

Qualquer dúvida posta ae...

Abraço

Crystian