Foros del Web » Programando para Internet » Javascript »

Pintar filas ASP+JAVASCRIPT

 Estas en el tema de Pintar filas ASP+JAVASCRIPT en el foro de Javascript en Foros del Web. Hola de nuevo, de nuevo molestando..., bueno me gustaria saber como puedo pintar una fila par de un color y la impar de otro color ...
  #1 (permalink)  
Antiguo 18/01/2007, 10:37
 
Fecha de Ingreso: enero-2007
Mensajes: 23
Antigüedad: 17 años, 3 meses
Puntos: 0
Pintar filas ASP+JAVASCRIPT
Hola de nuevo, de nuevo molestando..., bueno me gustaria saber como puedo pintar una fila par de un color y la impar de otro color al momento de mostrar mis registros de una tabla, lo hice en ASP con VBScript, me gustaria saber el codigo en ASP con JAVASCRIPT, si pudieran ayudarme se los agradecería

Ahi les mando el código con el que estoy trabajando: si alguien tuviera la solucion seria chevere...(SOLO ES PARA EJEMPLOS QUE DESARROLLO)

CREO QUE DE REPEPENTE NUESTRA AMIGA TUNAIT PODRIA AYUDAR...

<%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
<%
var cn=Server.CreateObject("ADODB.Connection");
//cn es la variable de conexion
var rs=Server.CreateObject("ADODB.Recordset");
//creando la variable rs que sera instancia del Recordset
//rs crea una copia del juego de registro de la base de datos

cn.Open="Provider=Microsoft.Jet.oledb.4.0;data source="+Server.MapPath("\\carrito\\Productos.mdb" );
//abriendo la conexion de la base de datos


%>
<style type="text/css">
<!--
.Estilo11 {color: #FFFFFF}
.Estilo12 {font-family: Arial, Helvetica, sans-serif}
.Estilo13 {font-size: 12px}
a:link {
color: #FF0000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FF0000;
}
a:hover {
text-decoration: underline;
color: #000099;
}
a:active {
text-decoration: none;
color: #000000;
}
.Estilo17 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; }
body {
background-color: #FFFFFF;
}
.Estilo18 {color: #000000}
-->
</style>
<body>
<form name="miform" method="post" action="ingresa_cancion.asp">
<table width="500" border="1" align="center">
<tr>
<td width="127" bgcolor="#FFFFFF"><strong>Titulo:</strong></td>
<td width="357" bgcolor="#000066"><input name="txttitulo" type="text" id="txttitulo" size="40" /></td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><strong>Autor:</strong></td>
<td bgcolor="#000066"><input name="txtautor" type="text" id="txtautor" size="40" /></td>
</tr>
<tr>
<td align="left" valign="top" bgcolor="#FFFFFF"><strong>Cancion:</strong></td>
<td bgcolor="#000066"><textarea name="txtcancion" cols="35" rows="4" wrap="physical" id="txtcancion"></textarea></td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><strong>Imagen:</strong></td>
<td bgcolor="#000066"><input name="txtfoto" type="text" id="txtfoto" size="40" /></td>
</tr>
<tr>
<td bgcolor="#FFFFFF"><strong>Fecha Inicio:</strong></td>
<td bgcolor="#000066">&nbsp;<span class="Estilo11">dia:</span>
<select name="cmbdia" id="cmbdia">
<script language="javascript">
for (i=1;i<=31;i++){
document.write("<option>"+i+"</option>");
}
</script>
</select>
<span class="Estilo11"> mes:</span>
<select name="cmbmes" id="cmbmes">
<script language="javascript">
for (i=1;i<=12;i++){
document.write("<option>"+i+"</option>");
}
</script>
</select>
<span class="Estilo11"> a&ntilde;o:</span><select name="cmbano" id="cmbano">
<script language="javascript">
for (i=2000;i<=2050;i++){
document.write("<option>"+i+"</option>");
}
</script>
</select> </td>
</tr>
<tr>
<td align="center"><input type="submit" name="Submit" value="Ingresar" /></td>
<td align="left"><strong>Probando una imagen como boton Submit</strong> <img src="../fotos/img1.jpg" name="imagen_boton" width="30" height="30" onClick="javascript:window.miform.submit();"></td>
</tr>
</table>
</form>
<table width="500" border="0" align="center">
<tr>
<td><table width="500" border="0" align="left">
<tr align="center">
<td><table width="715" border="1" align="center" bordercolor="#000000">
<tr>
<td width="115" align="center" bgcolor="#000066" class="Estilo11 Estilo1 Estilo2 Estilo5 Estilo12 Estilo13"><strong>Titulo</strong></td>
<td width="130" align="center" bgcolor="#000066"><span class="Estilo13 Estilo12 Estilo6 Estilo11"><strong>Autor</strong></span></td>
<td width="284" align="center" bgcolor="#000066"><span class="Estilo13 Estilo12 Estilo11 Estilo2 Estilo5"><strong>Cancion</strong></span></td>
<td width="64" align="center" bgcolor="#000066"><span class="Estilo13 Estilo12 Estilo11 Estilo2 Estilo5"><strong>Fecha</strong></span></td>
<td width="43" align="center" bgcolor="#000066">&nbsp;</td>
<td width="47" align="center" bgcolor="#000066">&nbsp;</td>
</tr>
</table>
<span class="Estilo17">
<% var cont=0;//Inicializando un contador, que servira para comprobar si no se encuentra algun registro...
var ssql="select * from Canciones order by id asc";
rs=cn.Execute(ssql);

while(!rs.EOF){//EOF = End of File(fin de archivo), el codigo dice: mientras sea diferente al fin de archivo que haga todo lo siguiente.
cont=cont+1;//Contando los registros...
%>

</span>
<table width="715" border="1">
<tr>
<td width="115" align="center" valign="top" bgcolor="#FFFFFF" class="Estilo17"><p class="Estilo12">
<a href="cancion.asp?qid=<%Response.Write(rs("id"))%> " class="Estilo18">
<% Response.Write(rs("tema")) %>
</a></p>
<table width="100" border="1" bordercolor="#000000">
<tr>
<td width="100"><a href="cancion.asp?qid=<%Response.Write(rs("id"))%> "><img src="../fotos/<% Response.Write(rs("foto"))%>.jpg" width="100" height="100" border="0"></a></td>
</tr>
</table>
<p class="Estilo12"><br>
<a href=cancion.asp?qid=<%Response.Write(rs("id"))%>> </a><br>
<br>
</p></td>
<td width="130" align="center" valign="top" bgcolor="#FFFFFF" class="Estilo17"><span class="Estilo12">
<% Response.Write(rs("autor")) %>
</span></td>
<td width="284" align="center" valign="top" bgcolor="#FFFFFF" class="Estilo17"><div align="justify"><span class="Estilo12">
<% var xcancion=String(rs("cancion"));//convirtiendolo el campo cancion en string para utilizar el substr.%>
<% Response.Write(xcancion.substr(1,200)+"...") %>

</span></div></td>
<td width="64" align="center" valign="top" bgcolor="#FFFFFF" class="Estilo17"><span class="Estilo12">
<% Response.Write(rs("fecha_inicio")) %>
</span></td>
<td width="43" align="center" valign="middle" bordercolor="#000000" bgcolor="#FFFFFF" class="Estilo17"><a href=ecancion.asp?qid=<%Response.Write(rs("id"))%> >Editar</a></td>
<td width="47" align="center" valign="middle" bordercolor="#000000" bgcolor="#FFFFFF" class="Estilo17"><a href=bcancion.asp?qid=<%Response.Write(rs("id"))%> >Borrar</a></td>
</tr>
</table>
<span class="Estilo17">
<%
rs.MoveNext;//rs.MoveNext es para avanzar a la siguiente fila


};
if (cont==0){//Cuando el contador es igual a cero, quiere decir que no encontro ningun registro, entonces imprime lo siguiente:
%>
</span>
<table width="333" border="0">
<tr>
<td width="327">No encontro nada, llenar la base de datos por favor... </td>
</tr>
</table>
<span class="Estilo17">
<%
}

rs.Close;//cerrar el registro
cn.Close;//cerrar la conexion
%>

</span></td>
</tr>
</table></td>
</tr>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>
  #2 (permalink)  
Antiguo 18/01/2007, 11:01
Avatar de tunait
Moderadora
  
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Re: Pintar filas ASP+JAVASCRIPT
Qué tal feram1986

No sé muy bien en qué parte del código que has dejado estás pintando las filas así que mejor te he hecho un ejemplo simple a ver si te puede servir de referencia para adaptarlo tú mismo
Código HTML:
<%@LANGUAGE="JAVASCRIPT" CODEPAGE="1252"%>
<!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>
<title>Documento sin t&iacute;tulo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
.estilo1{
	background-color: #ffffcc;
}
.estilo2{
	background-color: #ffccff;
}
</style>
</head>

<body>
<table>
<%
var estilo;
for(m = 0; m < 10; m++){ 
	estilo = m%2 == 0 ? "estilo1" : "estilo2";
%>
	<tr class="<%=estilo%>">
		<td><%=m%></td>
	</tr>
<%
}
%>

</table>
</body>
</html>
Yá me contarás

Un saludo
  #3 (permalink)  
Antiguo 18/01/2007, 11:06
 
Fecha de Ingreso: enero-2007
Mensajes: 23
Antigüedad: 17 años, 3 meses
Puntos: 0
Re: Pintar filas ASP+JAVASCRIPT
En realidad no habia hecho el codigo, preferi no hacerlo porque no me salia, me salia muchos errores, queria ver si lo podian implementar ahi, gracias por la ayuda lo probaré...
  #4 (permalink)  
Antiguo 18/01/2007, 11:10
 
Fecha de Ingreso: enero-2007
Mensajes: 23
Antigüedad: 17 años, 3 meses
Puntos: 0
Re: Pintar filas ASP+JAVASCRIPT
Ese código es, siempre y cuando el contador sea menor a 10, pero lo queria trabajar con mis registros que muestro, suponiendo que tenga 20, cada fila tendria que salir con diferente color
  #5 (permalink)  
Antiguo 18/01/2007, 11:58
Avatar de tunait
Moderadora
  
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Re: Pintar filas ASP+JAVASCRIPT
Iterando por cada registro de un recordset podría ser algo así

Código HTML:
<table>
<%
var estilo;
var m = 0;
while(!rs.EOF){ 
	estilo = m%2 == 0 ? "estilo1" : "estilo2";
%>
	<tr class="<%=estilo%>">
		<td><%=rs("tuCampo")%></td>
	</tr>
<%
	m++;
}
%>

</table>
Prueba y me cuentas
  #6 (permalink)  
Antiguo 19/01/2007, 11:30
 
Fecha de Ingreso: enero-2007
Mensajes: 23
Antigüedad: 17 años, 3 meses
Puntos: 0
Re: Pintar filas ASP+JAVASCRIPT
Gracias por la ayuda tunait, no lo pude solucionar de la forma que me diste :(pero estuve probando de otra forma, ahi la mando:

<%
var fila =0;
var vcolor;

while(!rs.EOF){

if(fila==1){
vcolor="#CCCCCC";
fila=0;
}else if(fila==0){
vcolor="FFFFFF";
fila=1;
}

%>

y en el bgcolor de cada td donde pintamos los campos

td bgcolor=<%Response.Write(vcolor)%>

<%
rs.MoveNext;
};
%>

Cuidate, gracias, bye
  #7 (permalink)  
Antiguo 19/01/2007, 12:27
Avatar de tunait
Moderadora
  
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Re: Pintar filas ASP+JAVASCRIPT
Ouch, me faltó el mover el cursor al siguiente registro en el código que te dejé

Código: 
<table>
<%
var estilo;
var m = 0;
while(!rs.EOF){ 
	estilo = m%2 == 0 ? "estilo1" : "estilo2";
%>
	<tr class="<%=estilo%>">
		<td><%=rs("tuCampo")%></td>
	</tr>
<%
	m++;
	rs.MoveNext;
}
%>

</table>
Bueno, me alegra que lo resolvieras

Un saludo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 15:22.