Foros del Web - Ver Mensaje Individual - Script OnLoad no permite cambiar el estilo en tabla

khristian_696 · #4 (**permalink**) 15/06/2012, 10:36

Gracias por responder furoya, el código lo he recortado un poco debido a que es muy largo, sin embargo les dejó lo que a mi consideración es la escencia del código:

Código:

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script type="text/javascript">
function activateThisRow(row,flgMuestra){
var table = document.getElementById('pricetable');
var form = document.getElementById('prices');
var formNotas = document.getElementById('divNotas');
var frmMain = document.getElementById('frmMain');
//Removemos las clases de los tds que esten en on
var tds = table.getElementsByTagName('td');
var fecha ="0";
var estatus ="0";
for(var m=0;m<tds.length;m++)
{
if(tds[m].className.substr(8,2)=='on')
{
if(fecha=="0")
{
fecha = tds[m+9].innerHTML;
estatus = tds[m+12].innerHTML.toUpperCase();
estatus = estatus.replace("?,"A");
estatus = estatus.replace("?,"E");
estatus = estatus.replace("?,"I");
estatus = estatus.replace("?,"O");
estatus = estatus.replace("?,"U");
}
removeClassName(tds[m],'on');
var diferencia=diferenciaFechas(fecha,"15/06/2012");
var dias = Math.floor(diferencia /(1000 * 60 * 60 * 24));
if(estatus!="EN PRODUCCION"&& estatus!="DETENIDO"&& estatus!="CANCELADO")
{
if(dias<=5 && dias>=3 )
{
addClassName(tds[m],'yellow');
}
else if(dias<=3)
{
addClassName(tds[m],'red');
}
}
}
else
{
addClassName(tds[m],'');
}
}
// Asignamos las clases de los tds que se hayan seleccionado 
var newths = getElementsByClassName(row,'td', table);
var aValores = new Array();
for (var h=0; h<newths.length; h++){
//No aplicamos el estilo en la ?a columna que contiene la descripci??ompleta
if(h<=17)
{
removeClassName(newths[h],'red');
removeClassName(newths[h],'yellow');
addClassName(newths[h],'on');
newths[h].style.display ='';
}
aValores[h]= newths[h].innerHTML;
// not all browsers like display ='block' for cells
}
//Determinamos los valores del formulario de editar
document.getElementById('PI_ID_ACTIVIDAD').value = aValores[3];
document.getElementById('PI_FECHA_INICIAL').value = aValores[8];
document.getElementById('PI_FECHA_COMPROMISO').value = aValores[9];
document.getElementById('PI_FECHA_COMP_INI').value = aValores[9];
document.getElementById('PI_ID_PRIORIDAD').value = aValores[10];
aValores[12]= aValores[12].toUpperCase();
aValores[12]=aValores[12].replace("?,"A");
aValores[12]=aValores[12].replace("?,"E");
aValores[12]=aValores[12].replace("?,"I");
aValores[12]=aValores[12].replace("?,"O");
aValores[12]=aValores[12].replace("?,"U");
frmMain.PI_ID_ESTATUS.selectedIndex = getIdEstatus(aValores[12]);
frmMain.PI_AVANCE.value = aValores[11];
frmMain.PI_COMENTARIOS.value = aValores[18];
frmMain.PI_NOTA.value = aValores[19];
frmMain.PI_NOTA_ANT.value = aValores[19];
//Determinamos los valores para el formulario de Notas
document.getElementById('PI_ID_ACTIVIDAD_N').value = aValores[3];
document.getElementById('PI_NOTAS').value = aValores[19];
document.getElementById('PI_FLG_NOTA').value = aValores[20];
// show the form!
if(flgMuestra==1)
{
form.style.display ='block';
}
else if(flgMuestra==2)
{
formNotas.style.display ='block';
}
}
function MakeStaticHeader(gridId, height, width, headerHeight, isFooter){
var tbl = document.getElementById(gridId);
if (tbl){
var DivHR = document.getElementById('DivHeaderRow');
var DivMC = document.getElementById('DivMainContent');
var DivFR = document.getElementById('DivFooterRow');
 
//*** Set divheaderRow Properties ****
DivHR.style.height = headerHeight +'px';
DivHR.style.width =(parseInt(width)- 16)+'px';
DivHR.style.position ='relative';
DivHR.style.top ='0px';
DivHR.style.zIndex ='30';
DivHR.style.verticalAlign ='top';
//*** Set divMainContent Properties ****
DivMC.style.width = width +'.px';
DivMC.style.height = height +'.px';
DivMC.style.position ='relative';
DivMC.style.top =-headerHeight +'.px';
DivMC.style.zIndex ='20';
 
//*** Set divFooterRow Properties ****
DivFR.style.width =(parseInt(width)- 16)+'px';
DivFR.style.position ='relative';
DivFR.style.top =-headerHeight +'px';
DivFR.style.verticalAlign ='top';
DivFR.style.paddingtop ='2px';
 
if (isFooter){
var tblfr = tbl.cloneNode(true);
tblfr.removeChild(tblfr.getElementsByTagName('tbody')[0]);
var tblBody = document.createElement('tbody');
tblfr.style.width ='100%';
tblfr.cellSpacing ="0";
//*****In the case of Footer Row *******
tblBody.appendChild(tbl.rows[tbl.rows.length - 1]);
tblfr.appendChild(tblBody);
DivFR.appendChild(tblfr);
}
//****Copy Header in divHeaderRow****
DivHR.appendChild(tbl.cloneNode(true));
}
}
function OnScrollDiv(Scrollablediv){
document.getElementById('DivHeaderRow').scrollLeft = Scrollablediv.scrollLeft;
document.getElementById('DivFooterRow').scrollLeft = Scrollablediv.scrollLeft;
}
window.onload=function(){
Nifty("ul#split h3","top");
Nifty("ul#split div","none same-height");
MakeStaticHeader('pricetable', 450, 1000, 32, false)
}
if (window.addEventListener)
{
window.addEventListener("keydown", compruebaTecla, false);
}
else if (document.attachEvent)
{
document.attachEvent("onkeydown", compruebaTecla);
}
</script>
</head>
<body background="images\modbkgnd.jpg">
<div style="FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR:#330066; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-ALIGN: left"><center>Consulta de actividades registradas</center></div>
</br>
<div id="DivRoot" align="left">
<div style="overflow: hidden;" id="DivHeaderRow">
</div>
<div id="DivMainContent" style="overflow:scroll;" onscroll="OnScrollDiv(this)" id="DivMainContent">
<table id="pricetable">
<thead >
<tr>
<th class="side">#</th>
<th class="side">Editar</th>
<th class="side">Nota</th>
<th class="side">ID</th>
<th class="side">Nombre Gerente</th>
<th class="side">Actividad</th>
<th class="side">Persona Asignada</th>
<th class="side">Requerimiento</th>
<th class="side">Fecha Inicio</th>
<th class="side">Fecha Compromiso</th>
<th class="side">Prioridad</th>
<th class="side">% Avance</th>
<th class="side">Estatus</th>
<th class="side">Fecha Alta</th>
<th class="side">Usuario Alta</th>
<th class="side">Fecha Modificaci??th>
<th class="side">Usuario modificaci??th>
<th class="side">Comentarios</th>
<th class="side" style="display:none;">Comentarios</th>
<th class="side" style="display:none;">Notas</th>
<th class="side" style="display:none;">FLG_NOTA</th>
</tr>
</thead>
<tbody>
<tr >
<td class="choice1 on">1</td>
<td class="choice1 on"><a href="signUpChoice1.html" onclick="activateThisRow('choice1',1);return false;"><img src="\images\edit.png" alt="Editar" width="20",height="20"/></a></td>
<td class="choice1 on"><a href="notasChoice1.html" onclick="activateThisRow('choice1',2);return false;"><img src="\images\prendido.png" alt="Nueva nota" width="20",height="20"/></a></td>
<td class="choice1 on">187</td>
<td class="choice1 on">Israel</td>
<td class="choice1 on">sd</td>
<td class="choice1 on">Christian</td>
<td class="choice1 on">a</td>
<td class="choice1 on">30/05/2012</td>
<td class="choice1 on">30/05/2012</td>
<td class="choice1 on">2</td>
<td class="choice1 on">10</td>
<td class="choice1 on">En proceso</td>
<td class="choice1 on">30/05/2012 18:11:38</td>
<td class="choice1 on">Israel</td>
<td class="choice1 on">12/06/2012 10:11:51</td>
<td class="choice1 on">Christian</td><td class="choice1 on">sdf</td><td class="choice1" style="display:none;">sdf</td><td class="choice1" style="display:none;">asd</td><td class="choice1" style="display:none;">1</td></tr>
</tbody>
</table>
</div>
<div id="DivFooterRow" style="overflow:hidden">
</div>
</div>
</body>
</html>

Y lo de las comillas es porque la programación se hace desde la BD, en mi caso con el IDE de TOAD, es por eso que pongo dobles comillas ya que en el renderizado el compilador las representa como una sola.
De cualquier manera quedo pendiente de las dudas o comentarios.