Foros del Web » Programando para Internet » Javascript »

Como poner el setAttribute para lograr contenido de tabla

Estas en el tema de Como poner el setAttribute para lograr contenido de tabla en el foro de Javascript en Foros del Web. Hola, estoy programando utilizando AJAX. Tengo lo siguiente en el aspx: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código aspx: Ver original <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Ajax.aspx.vb" Inherits="AJAX1.Ajax" %>   ...
  #1 (permalink)  
Antiguo 30/04/2013, 02:35
 
Fecha de Ingreso: abril-2012
Mensajes: 449
Antigüedad: 12 años, 1 mes
Puntos: 7
Como poner el setAttribute para lograr contenido de tabla

Hola, estoy programando utilizando AJAX. Tengo lo siguiente en el aspx:
Código aspx:
Ver original
  1. <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Ajax.aspx.vb" Inherits="AJAX1.Ajax" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7.     <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
  8.     <div class="header">
  9.             <div class="title">
  10.                 <h1>
  11.                    AJAX
  12.                 </h1>
  13.             </div>
  14.         </div>
  15.     </div>
  16.     <title>AJAX</title>
  17. </head>
  18. <body>
  19.     <form id="form1" runat="server">
  20.     <div class="page">
  21.         <div id="busqueda">
  22.                 <asp:Table ID="TableBuscar" runat="server" BorderColor="Gray" CellPadding="2" CellSpacing="5"  Width="300px" align="center">  
  23.                     <asp:TableRow Font-Bold="True" Font-Overline="False">
  24.                         <asp:TableCell ID="TableCellBuscar1" HorizontalAlign="Left" Enabled="True" Width="300px">
  25.                             <asp:Label ID="LabelBuscar1" runat="server" Text="Introduzca el nombre del operario:" aling="center"></asp:Label><br />
  26.                         </asp:TableCell>
  27.                     </asp:TableRow>
  28.                     <asp:TableRow>
  29.                         <asp:TableCell ID="TableCellBuscar2" HorizontalAlign="Left" Enabled="True" Width="250px">
  30.                             <asp:TextBox ID="TextNombreBuscar" runat="server" aling="Left" Width="250px"></asp:TextBox>                    
  31.                             <asp:Label ID="LabelAsterisco1" runat="server" aling="center"></asp:Label><br />
  32.                         </asp:TableCell>                
  33.                         <asp:TableCell ID="TableCellBuscar3" HorizontalAlign="Left" Enabled="True" Width="50px">
  34.                             <input id="btnBuscar" type="button" value="BUSCAR" onclick="Ajax.obtener_operarios(getElementById('TextNombreBuscar').value,obtener_operarios_CallBack)" /><br>
  35.                         </asp:TableCell>
  36.                     </asp:TableRow>
  37.                 </asp:Table>
  38.             </div>
  39.  
  40.             <div id="tabla2">
  41.                 <asp:Table ID="Table2" runat="server" BorderColor="Black" CellPadding="2" CellSpacing="5"  Width="770px" align="center" HorizontalAlign="Center">  
  42.                     <asp:TableRow Font-Bold="True" Font-Overline="False" BackColor="Silver">
  43.                         <asp:TableCell ID="Table2Cell1" HorizontalAlign="Center" Enabled="True" Width="150px" VerticalAlign="Middle">
  44.                             <asp:Label ID="LabelCell1" runat="server" Text="NºOPERARIO" Font-Bold="True" Font-Underline="True" ForeColor="Black" Font-Size="Medium"></asp:Label>
  45.                         </asp:TableCell>
  46.                         <asp:TableCell ID="Table2Cell2" HorizontalAlign="Center" Enabled="True" Width="300px" VerticalAlign="Middle">
  47.                             <asp:Label ID="LabelCell2" runat="server" Text="OPERARIO" Font-Bold="True" Font-Underline="True" ForeColor="Black" Font-Size="Medium"></asp:Label>
  48.                         </asp:TableCell>
  49.                         <asp:TableCell ID="Table2Cell3" HorizontalAlign="Center" Enabled="True" Width="170px" VerticalAlign="Middle">
  50.                             <asp:Label ID="LabelCell3" runat="server" Text="DETALLE MENSUAL" Font-Bold="True" Font-Underline="True" ForeColor="Black" Font-Size="Medium"></asp:Label>
  51.                         </asp:TableCell>
  52.                         <asp:TableCell ID="Table2Cell4" HorizontalAlign="Center" Enabled="True" Width="150px" VerticalAlign="Middle">
  53.                             <asp:Label ID="LabelCell4" runat="server" Text="MES" Font-Bold="True" Font-Underline="True" ForeColor="Black" Font-Size="Medium"></asp:Label>
  54.                         </asp:TableCell>
  55.                     </asp:TableRow>
  56.                 </asp:Table>  
  57.             </div>
  58.             <div id="resultado">
  59.         </div>
  60.     </div>
  61.        
  62.     </form>
  63.  
  64.     <script type="text/javascript">
  65.         function obtener_operarios_CallBack(response) {
  66.             if (response.error != null) {
  67.                 alert("Se presentó un error ");
  68.                 return;
  69.             }
  70.  
  71.             var juntos = response.value.split(";");
  72.             miTabla = document.getElementById('Table2')
  73.             tbBody = document.createElement("tbody");
  74.  
  75.             for (i = 1; i < juntos.length; i++) {
  76.                 var operarios = juntos[i];
  77.                 var separaroperario = operarios.split("-");
  78.                 var resultado = i % 2;
  79.  
  80.                 tr = document.createElement("tr");
  81.                 tc1 = document.createElement("td");
  82.                 tc2 = document.createElement("td");
  83.                 tc3 = document.createElement("td");
  84.                 tc4 = document.createElement("td");
  85.  
  86. //                tc1.setAttribute("Width", "150px");
  87. //                tc1.setAttribute("HorizontalAlign", "Center");
  88. //                tc1.setAttribute("VerticalAlign", "Middle");
  89. //                tc2.setAttribute("Width", "300px");
  90. //                tc2.setAttribute("HorizontalAlign", "Left");
  91. //                tc2.setAttribute("VerticalAlign", "Middle");
  92. //                tc3.setAttribute("Width", "170px");
  93. //                tc3.setAttribute("HorizontalAlign", "Center");
  94. //                tc3.setAttribute("VerticalAlign", "Middle");
  95. //                tc4.setAttribute("Width", "150px");
  96. //                tc4.setAttribute("HorizontalAlign", "Center");
  97. //                tc4.setAttribute("VerticalAlign", "Middle");
  98. //                tc4.setAttribute("ForeColor", "Red");
  99.  
  100.                 tc1.innerHTML = separaroperario[0];
  101.                 tc2.innerHTML = separaroperario[1];
  102.                 tc3.innerHTML = separaroperario[2];
  103.                 tc4.innerHTML = separaroperario[3];
  104.  
  105.                 if (resultado == 0) {
  106.                     alert("ENTRA");
  107. //                    tc1.setAttribute = ("BackColor", "Drawing.Color.AliceBlue");
  108. //                    tc2.setAttribute = ("BackColor", "Drawing.Color.AliceBlue");
  109. //                    tc3.setAttribute = ("BackColor", "Drawing.Color.AliceBlue");
  110. //                    tc4.setAttribute = ("BackColor", "Drawing.Color.AliceBlue");
  111.                 }
  112.  
  113.                 tr.appendChild(tc1);
  114.                 tr.appendChild(tc2);
  115.                 tr.appendChild(tc3);
  116.                 tr.appendChild(tc4);
  117.                 tbBody.appendChild(tr);
  118.                
  119.             }
  120.             miTabla.appendChild(tbBody);
  121.             miCapa = document.getElementById('tabla2');
  122.             miCapa.appendChild(miTabla);                  
  123.         }
  124.    </script>
  125. </body>
  126. </html>

Lo que quiero hacer es darle posición a las celdas desde java script. Había comenzado haciendo lo que se ve comentado dentro del código pero aunque ponga eso no hace caso de las instrucciones que le digo.

alguien me puede echar una mano?

__________________
Gracias por todo;

Un saludo
  #2 (permalink)  
Antiguo 30/04/2013, 11:43
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: Como poner el setAttribute para lograr contenido de tabla

Hola:

Por lo que veo quieres asignar estilos y no atributos... algunos de esos estilos no existen (horizontalAlign, foreColor)...

Y para asignar estilos no se usa setAttribute, sino se pone el ebjeto seguido de style y el estilo que quieras: el_objeto.style.width = "100px";

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 02/05/2013, 01:30
 
Fecha de Ingreso: abril-2012
Mensajes: 449
Antigüedad: 12 años, 1 mes
Puntos: 7
Respuesta: Como poner el setAttribute para lograr contenido de tabla

Cita:
Iniciado por caricatos Ver Mensaje
Hola:

Por lo que veo quieres asignar estilos y no atributos... algunos de esos estilos no existen (horizontalAlign, foreColor)...

Y para asignar estilos no se usa setAttribute, sino se pone el ebjeto seguido de style y el estilo que quieras: el_objeto.style.width = "100px";

Saludos
Ok!!! Ya decía yo que esto no iba, . Con el "el_objeto.style.width = "100px";" que has puesto va perfecto. Mil gracias.

Tengo otro problemilla, cuando accedo por primera vez a la aplicación, me aparece la lista completa de operadores, pero como has podido observar en el aspx tengo un apartado de búsqueda que es donde utilizo AJAX.
Me podrías decir porque cuando quiero buscar algún nombre, después de la búsqueda sigo teniendo la lista entera de operarios y debajo de esta aparece la tabla de los operarios que coinciden con el nombre que he dado a buscar?

__________________
Gracias por todo;

Un saludo
  #4 (permalink)  
Antiguo 02/05/2013, 01:40
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años
Puntos: 1284
Respuesta: Como poner el setAttribute para lograr contenido de tabla

Hola:

La verdad es que no manejo asp, pero veo que usas en tu código la instrucción appendChild, y esa instrucción "añade" contenidos a lo existente... se puedes borrar ese contenido existe removeChild o para abreviar usar innerHTML = ""...

while (elemento.hasChildNodes()) elemento.removeChild(elemento.firstChild);

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 02/05/2013, 02:46
 
Fecha de Ingreso: abril-2012
Mensajes: 449
Antigüedad: 12 años, 1 mes
Puntos: 7
Respuesta: Como poner el setAttribute para lograr contenido de tabla

Cita:
Iniciado por caricatos Ver Mensaje
Hola:

La verdad es que no manejo asp, pero veo que usas en tu código la instrucción appendChild, y esa instrucción "añade" contenidos a lo existente... se puedes borrar ese contenido existe removeChild o para abreviar usar innerHTML = ""...

while (elemento.hasChildNodes()) elemento.removeChild(elemento.firstChild);

Saludos

Hola, Lo siento pero no sabría donde meter eso.
__________________
Gracias por todo;

Un saludo

Etiquetas: ajax
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




La zona horaria es GMT -6. Ahora son las 20:36.