JavaScript - funcion dibuja campos

   
Vista:
Imágen de perfil de Hfr

funcion dibuja campos

Publicado por Hfr (29 intervenciones) el 09/06/2016 23:46:22
Hola chicos que tal

tegno una fucncion que debuja campos
la autorioa original de la función es
http://www.w3schools.com/jsref/met_table_insertrow.asp

la modifique y la puse asi..

1
2
3
4
5
6
7
8
9
10
11
12
13
function myCreateFunction() {
    var table = document.getElementById("myTable");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    cell1.innerHTML = "<textarea  rows='1'   cols='35'      name='plan[]'></textarea>";
    cell2.innerHTML = "<textarea  rows='1'   cols='35'      name='plan[]'></textarea>";
}
 
function myDeleteFunction() {
    document.getElementById("myTable").deleteRow(0);
}
</script>

lo curioso es que la adición de las filas las hace de abajo asi arriaba
y con el archivo que procesa los datos de los campos dibujados quedan invertidos al recorrerlos con un for
entonces el ultimo campo creado toma la primera posición del arreglo y el primero la ultima
entonces alguien sabe como hacerle para que los campos adicionados se dibujen de forma opuesta de arriba a abajo y el primer campo


como ven la imagen el 3 fue el primer campo creado y lo pone al final.



imslsdks
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de kip

funcion dibuja campos

Publicado por kip (20 intervenciones) el 10/06/2016 04:13:21
Hola, aquella funcion siempre te creara los input text hacia arriba, aqui te dejo un codigo para que puedas crear los input text hacia abajo;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function addRow(tableID) {
            var table = document.getElementById('myTable');
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
            var cell1 = row.insertCell(0);
            var element1 = document.createElement("input");
            element1.type = "text";
            element1.name = "plan[]";
            cell1.appendChild(element1);
            var cell2 = row.insertCell(1);
            var element2 = document.createElement("input");
            element2.type = "text";
            element2.name = "plan[]";
            cell2.appendChild(element2);
 
        }
 
        function deleteRow(tableID) {
                var table = document.getElementById('myTable');
                var rowCount = table.rows.length;
            if (rowCount > 1){
                var del = rowCount -1 ;
                table.deleteRow(del);
            } else {
                alert ('No puedes borrar todos los elementos!');
            }
 
        }

Luego en los botones en el atributo evento onclick llamas a la funcion correspondiente y listo.

Si tienes algun problema, comentanos.

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Hfr

funcion dibuja campos

Publicado por Hfr (29 intervenciones) el 16/06/2016 21:34:46
Hola kip quedo super, que pena no comentar antes.

pero si tiene un problema.
pero no se si ya es la función .
el problema surge cuando se dibujan campos y se adicionan datos.
entonces al dibujar el campo, darle valores, y al eliminarlo.
el archivo que procesa los datos los recibe como un arreglo y la variable que toma los datos queda como indefinida.
y el insert dinámico que ya ayúdaste hacer en otro publicacion se totea.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de kip

funcion dibuja campos

Publicado por kip (20 intervenciones) el 18/06/2016 06:04:51
Hola, podrias usar alguna funcion para filtrar los indices y valores del array que esten vacios, si los recibes por PHP la funcion array_filter() te ayuda.

https://phppatos.wordpress.com/2010/12/02/eliminar-los-registros-vacios-de-un-array/

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Hfr

funcion dibuja campos

Publicado por Hfr (29 intervenciones) el 18/06/2016 15:13:32
Hola kip, bueno realice una prueba almacenando, solo almacenado en la base de datos los datos de los campos que son dibujados. los llene,
dibueje 4, le coloque datos borre 2 , y los guarde en la base de datos el insert dinámico funciono bn.
el problema lo genera el paso de los list box.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de kip

funcion dibuja campos

Publicado por kip (20 intervenciones) el 18/06/2016 15:47:49
Te recomiendo abrir un tema para tratar aquel problema, coloques todo el codigo que tienes hasta ahora y asi poder ayudarte.

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Hfr

funcion dibuja campos

Publicado por Hfr (29 intervenciones) el 18/06/2016 16:30:46
ok vale ya lo coloco
ne php
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar