Foros del Web » Programando para Internet » Jquery »

[SOLUCIONADO] Agregar select a Tabla dinamica

Estas en el tema de Agregar select a Tabla dinamica en el foro de Jquery en Foros del Web. Hola buenas a todos. Tengo el siguiente ejemplo: index.php Código: <html> <head> <title>prueba</title> <meta charset="UTF-8"> <script src="jquery-2.1.1.min.js"></script> <script src="agregar.js"></script> </head> <body> <table id="tabla" border="1"> <thead> ...
  #1 (permalink)  
Antiguo 09/01/2018, 10:43
 
Fecha de Ingreso: junio-2015
Mensajes: 3
Antigüedad: 3 años, 3 meses
Puntos: 1
Agregar select a Tabla dinamica

Hola buenas a todos.

Tengo el siguiente ejemplo:
index.php
Código:
<html>
    <head>
        <title>prueba</title>
        <meta charset="UTF-8">
        <script src="jquery-2.1.1.min.js"></script>
        <script src="agregar.js"></script>
    </head>
    <body>
        <table id="tabla" border="1">
            <thead>
                <tr>
                    <td>Titulo 1</td>
                    <td>Titulo 2</td>
                    <td>Titulo 3</td>
                </tr>
            </thead>
        </table>
        <input id="bt_add" type="button" value="agregar">
    </body>
</html>
agregar.js
Código:
$(document).ready(function(){
    $('#bt_add').click(function(){
        agregar();
    });
});
 
function agregar(){
    var fila='<tr>\n\\n\
                <td><select></select>\n\
                <td><input type="text"></td>\n\
                <td><input type="text"></td>\n\
              </tr>';
    $('#tabla').append(fila);
}
Lo que hace el ejemplo es que va agregando filas a la tabla con un botón, lo que quiero es que en la columna de Titulo 1 que los selects que se agreguen tengan datos de una consulta a una base de datos, pero no se bien hacerlo, espero me puedan orientar o si es que tengo que hacerlo de otra manera.

Saludos.
  #2 (permalink)  
Antiguo 09/01/2018, 15:04
Avatar de Alexis88
Objetivista
 
Fecha de Ingreso: noviembre-2011
Ubicación: Tacna, Perú
Mensajes: 5.413
Antigüedad: 6 años, 10 meses
Puntos: 926
Respuesta: Agregar select a Tabla dinamica

Si los datos también serán tomados dinámicamente, necesitarías hacer una petición asíncrona (AJAX) para así obtener los datos e insertarlos en el <select>. Para que sea más fácil de manejar, en el archivo que procese la consulta en el lado del servidor (PHP, ASP, JSP, Node.js), podrías crear los <option> para insertarlos fácilmente en la recepción de la respuesta en el primer archivo.

Código Javascript:
Ver original
  1. $.ajax({
  2.     url: "ejemplo.php",
  3.     data: {foo: "bar"}
  4. }).done(function(respuesta){
  5.     $("#tabla").append(
  6.     "<tr>
  7.        <td>
  8.            <select>" + respuesta + " </select>
  9.        </td>
  10.        <td><input type='text' /></td>
  11.        <td><input type='text' /></td>
  12.     </tr>");
  13. }).fail(function(xhr, error){
  14.     console.log(error);
  15. });

__________________
«Laissez faire et laissez passer, le monde va de lui même»

Última edición por Alexis88; 10/01/2018 a las 09:33 Razón: Cierre de llamada a método
  #3 (permalink)  
Antiguo 10/01/2018, 08:22
 
Fecha de Ingreso: junio-2015
Mensajes: 3
Antigüedad: 3 años, 3 meses
Puntos: 1
Respuesta: Agregar select a Tabla dinamica

Gracias por tu respuesta alexis88, ya probé tu código y me funciono excelentemente, solo para agregar en la linea 12 falto cerrar el append con );

Gracias por la ayuda saludos.

Etiquetas: dinamica, select, tabla
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 10:59.