Linha De Uma Table ("tr") Como Um Radio Button

Galera, blz,

Preciso de uma ajuda

Eu tenhu uma "grid" feita com table, e tenhu a seguinte situacao,

quando passa o mouse por cima das linhas, ele muda d cor, quando clico, ele fixa uma cor na linha, mas eu quero fazer a selecao da linha de uma linha so, no metodo q eu fiz, ele "seleciona" mais de uma linha, ou seja

-------------------------------------------------
linha 1
-------------------------------------------------
linha 2
-------------------------------------------------
linha 3
-------------------------------------------------
linha 4
-------------------------------------------------
linha 5
-------------------------------------------------

vamos dizer q eu quero selecionar a linha 2, certo, ela ficara vermelha, quando der um clique duplo, mas vamos supor q eu errei a linha q eu queria selecionar, ai vou dar um duplo clique na linha 4, a linha 2 teria q voltar a cor original, e a linha 4 ficar na cor vermelha, ...

O jeito q eu fiz, ele nao volta a linha 2 pra cor original, fiz com uns IFs condicionais... vejam se da pra entender o codigo da tag TR logo abaixo.


  <tr 

onClick="table.style.background='',this.style.background='#999999',clicado='sim'" onDblClick="this.style.background='',clicado='nao'"  
  
  onmouseover="
  if (this.style.background=='#999999')
  {
  }
  else
  {
  this.style.background='#FFFF00'
  }
  
  "
  
  
  
  onmouseout="
  if (this.style.background=='#999999')
  {
  this.style.background='#999999'
  }
  else
  {
  this.style.background=''
  } 
  
  
  ">

Preciso muito disso, ele funcionaria como um Radio Button, ou seleciona uma linha ou outra....

Abracos..
Leonardo Mendes

Ahhh, pessoal, mais uma perguntinha...

Como desabilitar a selecao de um texto ao dar um clique duplo.....na linha da tabela,

Obrigado

Leonardo Mendes

Eu tenho um código para selecionar ou uma ou outra linha da tabela de cores diferentes. Mas há dois problemas a resolver e que não sei as razões:

1º) Se for criada uma função com style.background e colocarmos no evento onClick ela não funciona.
2º) Não é possível testar se uma linha tem determinada cor, como no exemplo abaixo:

if (this.style.backgroundColor == #'FFFFFF')
	this.style.backgroundColor = #'000000';

Quanto ao primeiro problema colocaremos o código por inteiro no evento onClick.
Quanto ao segundo problema tentarei fazer alguma coisa para que eu possa testar se uma linha tem determinada cor mas de outra forma que não a mostrada acima.

Abaixo o código que desenvolvi e uma simples implementação logo depois.
OBS.: Segundo meu exemplo a id da tabela deve ser "tabela" e as variaveis marcadaAnterior e linhaMarcada inicializadas como false e zero respectivamente.

if (linhaMarcada != 0)
{
	marcadaAnterior = false;
	document.getElementById('tabela').rows[linhaMarcada].style.background = '#FFFFFF';
	if (this.rowIndex != linhaMarcada)
	{
		this.style.background = '#99CCFF';
		linhaMarcada = this.rowIndex;
		marcadaAnterior = true;
	}
	if (marcadaAnterior == false)
		linhaMarcada = 0;
}
else
{
	this.style.background = '#99CCFF';
	linhaMarcada = this.rowIndex;
}

<!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>Tabela de pacientes</title>
</head>

<body>
<script>
var linhaMarcada =0;
var marcadaAnterior = false;
</script>
<TABLE id="tabela" BORDER="1" bordercolor="#000000" width="4650" cellspacing="0" cellpadding="0">

<TR bgcolor="999999">
<TH width="121">NOME</TH>
<TH width="129">DATA DE NASCIMENTO</TH>
<TH width="115">RENDA</TH>
<TH width="117">SEXO</TH>
<TH width="135">ESTADO CIVIL</TH>
<TH width="139">TOSSE</TH>
<TH width="119">ESCARRO</TH>
<TH width="151">HEMOPTÓICO</TH>
<TH width="151">HEMOPTISE</TH>
<TH width="150">SUDOROSE NOTURNA</TH>
<TH width="150">FEBRE</TH>
<TH width="150">EMAGRECIMENTO</TH>
<TH width="150">DOR TORÁXICA</TH>
<TH width="150">CALAFRIOS</TH>
<TH width="150">DISPNÉIA</TH>
<TH width="150">ASTENIA</TH>
<TH width="150">ANOREXIA</TH>
<TH width="151">JÁ FUMOU</TH>
<TH width="150">FUMA ATUALMENTE</TH>
<TH width="150">DIABÉTICO</TH>
<TH width="150">ALCOÓLATRA</TH>
<TH width="150">TB ANTERIOR</TH>
<TH width="149">TB EXTRAPUMONAR</TH>
<TH width="151">INTERNAÇÃO HOSPITALAR</TH>
<TH width="150">CONTATO BACILO</TH>
<TH width="150">SIDA</TH>
<TH width="150">OBSERVAÇÕES</TH>
<TH width="150">CHANCE DE CONTAMINAÇÃO</TH>
<TH width="150">GRUPO DE RISCO</TH>
<TH width="150">GRÁFICO DE GRUPO</TH>
<TH width="150">VISTO DE ANÁLISE</TH>
</TR>
<tr onClick="if (linhaMarcada != 0){marcadaAnterior = false;document.getElementById('tabela').rows[linhaMarcada].style.background = '#FFFFFF';if (this.rowIndex != linhaMarcada){this.style.background = '#99CCFF';linhaMarcada = this.rowIndex;marcadaAnterior = true;}if (marcadaAnterior == false)linhaMarcada = 0;}else{this.style.background = '#99CCFF';linhaMarcada = this.rowIndex;}">
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td align="center"><input type="checkbox"/></td>
</tr>
<tr onClick="if (linhaMarcada != 0){marcadaAnterior = false;document.getElementById('tabela').rows[linhaMarcada].style.background = '#FFFFFF';if (this.rowIndex != linhaMarcada){this.style.background = '#99CCFF';linhaMarcada = this.rowIndex;marcadaAnterior = true;}if (marcadaAnterior == false)linhaMarcada = 0;}else{this.style.background = '#99CCFF';linhaMarcada = this.rowIndex;}">
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td>teste</td>
<td align="center"><input type="checkbox"/></td>
</tr>
</TABLE>
</body>
</html>

[]'s

Rony Braga.

Edição feita por: rvernet, 18/06/2006, 15:07.

#1 lsm2005

#2 rvernet

1 user(s) are reading this topic

Linha De Uma Table ("tr") Como Um Radio Button

#1 lsm2005

#2 rvernet

1 user(s) are reading this topic

Entrar