Jump to content
Fórum Script Brasil
  • 0

Tabela Dinamica!


babaloricha
 Share

Question

Bom galera to tentando fazer um script que monta uma celula da tabela pra cada "quarto", e qua quando a pessoa pssar o mouse por cimada celula tem que apareceer as propriedades do quarto. mas estou enfrentando uns probleminhas, com a passagem de parametros. rodem isso ai:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#Layer1 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
    left: 523px;
    top: 318px;
}
-->
</style>
</head>

<body>
<script language="javascript">
var listaquarto= new Array();
function quarto(n,o,cli){
    this.numero=n
    this.ocup=o;
    this.cliente=cli
    }
listaquarto[0]=new quarto(1,0,"rui");// simulacao dos dados do banco
listaquarto[1]=new quarto(2,0,"maria");
listaquarto[2]=new quarto(3,0,"jose");
listaquarto[3]=new quarto(4,1,"nalva");// quarto ocupado
listaquarto[4]=new quarto(5,0,"joao");
listaquarto[5]=new quarto(6,0,"thiago");
listaquarto[6]=new quarto(7,0,"matos");
listaquarto[7]=new quarto(8,1,"carol");// quero ocupado
listaquarto[8]=new quarto(9,0,"roberta");
listaquarto[9]=new quarto(10,0,"jeferson");
listaquarto[10]=new quarto(11,1,"luana");
listaquarto[11]=new quarto(12,0,"cesar");
total=listaquarto.length -1;
document.writeln("<table border=1 align='center'><tr>");
while(total!=0){
    document.writeln("<tr>");
    for(var j=0;j<listaquarto.length/2;j++,total--){
        if(total<0)
            alert("paro paro paro");
        if(listaquarto[total].ocup==0)
            document.writeln("<td onmouseover='statusvaga("+listaquarto[total]+");' width=30 align='center' bgcolor='#00ff00'>"+listaquarto[total].numero+"</td>");
        else document.writeln("<td width=30 align='center' bgcolor='red'>"+listaquarto[total].numero+"</td>");
    }
    document.writeln("</tr>");
}
document.writeln("</tr></table>");

function statusvaga(quarto){
    tabela=getElementById("tab");
    tabela.rows[0].cells[1].textContent=quarto.cliente;
}
</script>
<table>
<tr>
<td onmouseover="alert('a');" onmouseout="alert('b');">
opaaaa</td>
</tr>
<div id="Layer1">
<table id="tab">
    <tr>
    <td>cliente:</td><td></td>
    </tr>
</table>
</div>
</body>
</html>

se algum souber o que acontece eu aradeco muito! :P

Link to comment
Share on other sites

8 answers to this question

Recommended Posts

  • 0

opa,

sua passagem de parametros não esta funcionando por falta de aspas.

veja:

document.writeln("<td onmouseover=\"statusvaga('"+listaquarto[total]+"');\" width=30 align='center' bgcolor='#00ff00'>"+listaquarto[total].numero+"</td>");
agora ele vai chamar o metodo e passar seu objeto. pode colocar um alert dentro do metodo para verificar. ah, e pra testar o seu codigo aqui, eu fiz umas alteracoes, testes no IE.
statusvaga('"+listaquarto[total]+"');

alterei para:

statusvaga('"+listaquarto[total].cliente+"');
e o seu metodo:
function statusvaga(quarto){
    tabela=getElementById("tab");
    tabela.rows[0].cells[1].textContent=quarto.cliente;
}

alterei para

function statusvaga(cel) {
    tabela = document.getElementById("tab");
    tabela.rows[0].cells[1].innerHTML = cel;
}

porque havia duplicidade de nome de variavel (quarto) no codigo.

e aquele elemento textContent nunca ouvi falar, e não existe na biblia do javascript, e usando innerHTML funcionou de boa para escrever dentro do elemento celula.

era isso, sucesso ai,

t+

Link to comment
Share on other sites

  • 0

Minha resposta é um pouco diferente.

Primeiro:

Quando for criar Arrays informe o tamanho desejado.

var listaquarto= new Array(12);
Segundo: Na função quarto ficaram faltando alguns "ponto-e-virgula" ( ; ) Terceiro: No loop while foi colocado TR dentro de TR. E pra piorar, tem loops aninhados. O que fiz foi ajeitar as tags e reduzir pra 1 loop.
total=listaquarto.length-1;
document.writeln("<table border=1 align='center'><tr>");

while(total>=0){
    if(listaquarto[total].ocup == 0)
        document.writeln("<td width=30 align='center' bgcolor='#00ff00'>"+listaquarto[total].numero+"</td>");
    else
        document.writeln("<td onmouseover=\"statusvaga(listaquarto[" + total + "]);\" width=30 align='center' bgcolor='red'>"+listaquarto[total].numero+"</td>");
    total--;
}
document.writeln("</tr></table>");

e aquele elemento textContent nunca ouvi falar, e não existe na biblia do javascript, e usando innerHTML funcionou de boa para escrever dentro do elemento celula.

Pra se pegar o conteudo de uma célula você pode usar innerHTML (interpreta tags) ou innerText(não interpreta tags), que são o padrão. Mas o Opera não aceita o innerText, sendo necessário substituir por textContent(não interpreta tags).

Link to comment
Share on other sites

  • 0
Pra se pegar o conteudo de uma célula você pode usar innerHTML ou innerText, que são o padrão. Mas o Opera não aceita o innerText, sendo necessário substituir por textContent.

bom, como você mesmo escreveu innerHTML é o padrão.

o textContent eu testei aqui no meu IE6 e não funfou.

Link to comment
Share on other sites

  • 0

Opa e ai!

pois é, é só pra o Opera!

no fire fox também funciona! :lol:

mas já que o innerHTML funciona no ie e no ff melhor ainda!

Os lops a aninhados são propositais preciso de uma tabela com varias linhas!

pretendo fazer um script legal posicionamento! esse script vai fazer parte do meu tcc caso eu termine e claro!

Mas mesmo se não terminar vai ter agradecimentos para o pessoal aqui do forum :lol:

eu corrigi de acordo com oque vocês postaram mas mesmo assim quando tento passar um objeto" listaquarto" não cosnigo acessar as propriedades!

mas se eu passar a priedade "listaquarto.numero" ai vai! tem alguma manha especial pra passar objeto e acessar as propriedadades dentro da função?

há e tem outra porque o layer não fica na posicao que eu botei? sera por causa do document.writeln?

Edited by babaloricha
Link to comment
Share on other sites

  • 0

então cara,

quando tu passa o objeto listaquarto por parametro, a assinatura do metodo não reconhece o tipo da variavel e interpreta como Object[].

então se você tentar ler obj.cliente, não vai rolar mesmo.

só se existisse uma forma de informar ao objeto o tipo dele depois que chega ao metodo.

((quarto)obj).cliente por exemplo.

mas isso não rola em js.

o que tu pode fazer, é passar os atributos separadamente na assinatura do metodo.

ou então, melhor, passar só o indice do array onde se encontra o objeto.

ao invés de:
statusvaga(listaquarto[" + total + "]);

passar:
statusvaga(total);
e ai no metodo recupera a linha do array pelo indice.
function statusvaga(linha) {
    tabela = document.getElementById("tab");
    tabela.rows[0].cells[1].innerHTML = listaquarto[linha].cliente;
}

e o problema do layer é isso mesmo, é por causa do document.write...

experimenta colocar o seu codigo html que contem a div antes do script que contem o document.write.

sucesso ai,

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share



  • Forum Statistics

    • Total Topics
      150.2k
    • Total Posts
      647.5k
×
×
  • Create New...