Ver Mensaje Individual
  #2 (permalink)  
Antiguo 03/08/2015, 10:55
Avatar de lauser
lauser
Moderator Unix/Linux
 
Fecha de Ingreso: julio-2013
Ubicación: Odessa (Ukrania)
Mensajes: 3.278
Antigüedad: 11 años, 5 meses
Puntos: 401
Respuesta: Generar cajas de texto Dinamicos

Con un simple view-source,,,,lo tenias.

Código HTML:
Ver original
  1.     <title>Demo: manipulacion de DOM en tablas con MooTools version 0.1.1</title>
  2.    
  3.     <script type="text/javascript" src="../../lib/mootools-release-1.11.js"></script>
  4.     <script type="text/javascript" src="dom_tabla-0.2.js"></script>
  5.    
  6.     <style type="text/css">
  7.    
  8.     .titulo_columna
  9.     {
  10.         background-color: blue;
  11.         color: white;
  12.         text-weight: bolder;
  13.         text-align: center;
  14.     }
  15.    
  16.     .celda_normal
  17.     {
  18.         background-color: #D3DAED;
  19.     }
  20.    
  21.     </style>
  22.  
  23.     <script type="text/javascript">
  24.  
  25.     ////////////////////////////////////////////////////////////////////////////////
  26.  
  27.     function obtEstructuraRegistro(tablaId)
  28.     {
  29.         var registro = new Array();
  30.  
  31.         if(tablaId == "lista_integrantes")
  32.         {
  33.             registro[0] = { 'elemento': 'input',
  34.                     'type'    : 'checkbox',
  35.                     'id'      : 'marca',
  36.                     'name'    : 'marca' };
  37.  
  38.             registro[1] = { 'elemento'  : 'input',
  39.                     'type'      : 'text',
  40.                     'id'        : 'nombres[]',
  41.                     'name'      : 'nombres[]',
  42.                     'style'     : 'font-size: 11px',
  43.                     'value'     : '',
  44.                     'size'      : '20',
  45.                     'maxlength' : '60' };
  46.  
  47.             registro[2] = { 'elemento'  : 'input',
  48.                     'type'      : 'text',
  49.                     'id'        : 'apellidos[]',
  50.                     'name'      : 'apellidos[]',
  51.                     'style'     : 'font-size: 11px',
  52.                     'value'     : '',
  53.                     'size'      : '20',
  54.                     'maxlength' : '60' };
  55.            
  56.             registro[3] = { 'elemento'  : 'input',
  57.                     'validador' : 'numbers',
  58.                     'type'      : 'text',
  59.                     'id'        : 'edad[]',
  60.                     'name'      : 'edad[]',
  61.                     'style'     : 'font-size: 11px',
  62.                     'value'     : '',
  63.                     'size'      : '4',
  64.                     'maxlength' : '4' };
  65.  
  66.                     registro[4] = { 'elemento' : 'select',
  67.                             'id'       : 'cargo[]',
  68.                             'name'     : 'cargo[]',
  69.                             'style'    : 'font-size: 11px',
  70.                             'value'    : '',
  71.                             'items'  : {'N/S'      : 0,
  72.                                          'Director' : 1,
  73.                                      'Técnico'  : 2,
  74.                                      'Operario' : 3,
  75.                                      'Asistente': 4}
  76.                             };
  77.  
  78.             return registro;
  79.         }
  80.  
  81.         return null;
  82.     }
  83.  
  84.     function obtPropiedadesCampo(tablaId)
  85.     {
  86.         if (tablaId == "lista_integrantes")
  87.         {
  88.             return {'class': 'celda_normal'};
  89.         }
  90.  
  91.         return null;
  92.     }
  93.  
  94.     function obtPropiedadesFila(tablaId)
  95.     {
  96.         if (tablaId == "lista_integrantes")
  97.         {
  98.             return {}
  99.         }
  100.  
  101.         return null;
  102.     }
  103.  
  104.     ////////////////////////////////////////////////////////////////////////////////
  105.        
  106.     </script>
  107.    
  108. </head>
  109.  
  110. <table id="lista_integrantes" style="width: 50%;">
  111.     <tr class="TDCabecera">
  112.         <td style="text-align: center; font-weight: bold; width: 50px;" class="titulo_columna">Marca</td>
  113.         <td style="text-align: center; font-weight: bold;" class="titulo_columna">Nombres</td>
  114.         <td style="text-align: center; font-weight: bold;" class="titulo_columna">Apellidos</td>
  115.         <td style="text-align: center; font-weight: bold;" class="titulo_columna">Edad</td>
  116.         <td style="text-align: center; font-weight: bold;" class="titulo_columna">Cargo</td>
  117.     </tr>
  118.  
  119. <br />
  120.  
  121. <div>
  122.     <input type="button" value="Agregar" onclick="TDAgregarRegistro('lista_integrantes')" />&nbsp;
  123.     <input type="button" value="Remover" onclick="TDRemoverRegistros('lista_integrantes')" />
  124. </div>
  125. </body>
  126. </html>

PD: deberas crear las tablas.
__________________
Los usuarios que te responden, lo hacen altruistamente y sin ánimo de lucro con el único fin de ayudarte. Se paciente y agradecido.
-SOLOLINUX-

Última edición por lauser; 03/08/2015 a las 11:00