problemas con getElementById
Publicado por Oskar (2 intervenciones) el 27/12/2005 18:48:44
Estoy haciendo un script de javascript para hacer categorias y subcategorias de manera infinita. Aqui esta el codigo comentado, si teneis alguna duda o no me he explicado bien decidmelo.
Muchas Gracias por cualquier ayuda!
<html>
<head>
<script language="javascript">
// CATEGORIAS
//Hay dos tipos de categorias, las categorias principales, y las
//subcategorias (que pueden ser subcategorias de las categorias principales
//o subcategorias de las subcategorias, de forma infinita)
//Variables:
//- num_categoria --> contador para añadir categorias principales
//- veces_cat=0 --> contador para que, cuando se hayan insertado
// previamente categorias, seleccione el maximo identificador
// encontrado en categorias solo una vez en lugar de cada vez
// que se llame a la funcion nuevacategoria y que inserte a
// partir de ese maximo identificador
//- subcat --> vector al que se le referencia a traves de un id de categoria,
// y que contendra el numero de subcategorias que tiene una categoria (o
// una subcategoria)
var num_categoria=1;
var veces_cat=0;
subcat=new Array();
function nuevacategoria(max){
// A esta funcion se le llama solamente en el momento de insertar nuevas categorias principales
//Recibe max, que es el maximo identificador de las categorias existentes
//en la base de datos. Sirve para que los nuevos identificadores continuen
//a partir del maximo, que es un numero entero.
//-----------------------------
//EN ESTE CASO MAX ES SIEMPRE 1
//-----------------------------
//Asigna el maximo al identificador de categoria (o numero de categoria)
//solamente si es la primera vez que se ha accedido a la funcion
veces_cat++;
if(veces_cat==1){
num_categoria=max;
}
// Se busca el objeto de la pagina que tenga como nombre "categorias", que es una capa
var categorias = document.getElementById("categorias");
//Se introduce codigo HTML en esa capa, que se trata de otra capa con el nombre igual al numero
//de categoria que se va a insertar en la bd
categorias.innerHTML+="<div id=categoria_"+num_categoria+">";
var categoria = document.getElementById("categoria_"+num_categoria+"");
// Dentro de esa nueva capa se introduce:
//- Campo de texto de formulario con el numero de la categoria como indetificador
//- Links a funciones de JavaScript para insertar nuevas subcategorias a la categoria actual,
//y para eliminarla (la categoria actual). A estas funciones se les pasa el numero de categoria actual
//- Otra nueva capa donde se insertaran las posibles subcategorias de la subcategoria actual
//con el identificador de la nueva categoria
categoria.innerHTML+="<br>";
categoria.innerHTML+=""+num_categoria+". <input type=text id="+num_categoria+" name="+num_categoria+">";
categoria.innerHTML+=" <a href='javascript:nuevasubcategoria("+num_categoria+",0)'>Añadir subcategoria</a>";
categoria.innerHTML+=" <a href='javascript:quitacategoria("+num_categoria+")'>Eliminar</a>";
categoria.innerHTML+="<div id=subcategoriasde_"+num_categoria+"></div>";
num_categoria++;
}
function nuevasubcategoria(id_cat,max){
// A esta funcion se le llama cada vez que se quiera insertar una nueva subcategoria
//Recibe el identificador o numero de la categoria a la que se le va a insertar una subcategoria
//y el numero de subcategorias que ya tenga (solo en el caso de estar editando, si la categoria
//principal es nueva, max vale 0
//Fuerzo al identificador recibido que sea de tipo texto
id_cat=""+id_cat
//for(i=0;i<=max;i++){
// Si en el vector subcat ya existe una referencia del identificador de categoria,
//incrementa el valor, en caso contrario, lo inicializa a 1
//Se repite tantas veces como valga max, para conseguir, en el caso de estar editando,
//que el identificador de la subcategoria comience despues del maximo valor de
//subcategoria que exista en la base de datos
if(subcat[id_cat]){
subcat[id_cat]++;
}else{
subcat[id_cat]=1;
}
//}
// num_subcategoria identificara a las nuevas subcategorias
//se crea a partir del identificador de la categoria superior,
//con el numero de subcategoria.
//----------------------------------------------------------------------------------------------------------------------------------------
//En un primer momento pense en utilizar un num_subcategoria de las formas 1, 2, 3... para categorias principales
//11, 12, 13, 14, ... para las subcategorias de "1",
//21, 22, 23, 24, ... para las subcategorias de "2",
//51, 52, 53, 54, ... para las subcategorias de "5" etc.
//111, 112, 113, 114, 115, ... para las subcategorias de "11",
//241, 242, 243, 244, 245, ... etc para las subcategorias de "24",
//y asi sucesivamente.
//El problema es que no se pueden poner mas de nueve subcategorias, ya que al procesar los identificadores en otra pagina
//cuento el numero de digitos, y al poner, por ejemplo, 10 subcategorias a la subcategoria "12", su num_categoria era "1210", y tal y
//como lo proceso en la otra pagina, eso significa que es la subcategoria numero "0" de la subcategoria "121"
//La solucion logica es poner un separador en medio de cada numero, yo me decante por el guion bajo.
//De esta forma quedaria...
//1, 2, 3...
//1_1, 1_2, 1_3, 1_4, ... para las subcategorias de "1",
//2_1, 2_2, 2_3, 2_4, ... para las subcategorias de "2",
//5_1, 5_2, 5_3, 5_4, ... para las subcategorias de "5" etc.
//1_1_1, 1_1_2, 1_1_3, 1_1_4, 1_1_5, ... para las subcategorias de "1_1",
//2_4_1, 2_4_2, 2_4_3, 2_4_4, 2_4_5, ... etc para las subcategorias de "2_4",
//y asi sucesivamente.
//---------------------------------------------------------------------------------------------------------------------------------------
//COMENTAR Y DESCOMENTAR ESTAS LINEAS DE ABAJO PARA PROBAR CON GUION O SIN GUION
//SIN GUIONES
num_subcategoria=id_cat+""+subcat[id_cat];
// Calculamos el numero de espacios que se deben colocar delante de la caja de texto
//En el caso de identificadores sin guiones, calculamos en numero de digitos de num_subcategoria
var n=num_subcategoria;
var num_espacios=0;
while(parseInt(n)!=0){
n=n/10;
num_espacios++;
}
/*
//CON GUIONES
num_subcategoria=id_cat+"_"+subcat[id_cat];
// Calculamos el numero de espacios que se deben colocar delante de la caja de texto
//En el caso de identificadores con guiones, buscamos el numero de guiones de num_subcategoria
var num_espacios=0;
for(i=0;i<num_subcategoria.length;i++){
if(num_subcategoria.charAt(i)=="_"){
num_espacios++;
}
}
*/
// Busca en la pagina el elemento que sea igual a "subcategoriade_" con el id de categoria padre
//para que inserte en ese objeto (que es una capa)
//----------PROBLEMA-------------------------------------------------
//-------------------------------------------------------------------
//Por algun motivo que desconozco, al utilizar el getElementById
//con id_cat contiendo caracteres que no sean numericos, no funciona
//-------------------------------------------------------------------
//----------PROBLEMA-------------------------------------------------
var subcategoriasde = document.getElementById("subcategoriasde_"+id_cat);
// Insertamos una nueva capa para identificar la nueva subcategoria
subcategoriasde.innerHTML+="<div id=subcategoria_"+num_subcategoria+">";
var subcategoria = document.getElementById("subcategoria_"+num_subcategoria);
// Insertamos tantas tabulaciones como guiones existan en el identificador
//de subcategoria para desplazar la caja de texto
for(i=1;i<=num_espacios;i++){
subcategoria.innerHTML+=" ";
}
// Dentro de la nueva capa de subcategoria se introduce:
//- Campo de texto de formulario con el numero de la subcategoria
//- Links a funciones de JavaScript para insertar nuevas subcategorias a la subcategoria actual,
//y para eliminarla (la subcategoria actual). A estas funciones se les pasa el numero de subcategoria actual
//- Una nueva capa donde se insertaran las posibles subcategorias de la subcategoria actual
//con el identificador de la nueva subcategoria
subcategoria.innerHTML+=""+subcat[id_cat]+". <input type=text id="+num_subcategoria+" name="+num_subcategoria+"> ";
subcategoria.innerHTML+=" <a href='javascript:nuevasubcategoria("+num_subcategoria+",0)'>Añadir subcategoria</a>";
subcategoria.innerHTML+=" <a href='javascript:quitasubcategoria("+num_subcategoria+")'>Eliminar</a>";
subcategoria.innerHTML+="<div id=subcategoriasde_"+num_subcategoria+"></div>";
}
function quitasubcategoria(id_cat) {
// Busca el objeto que tiene el numero de subcategoria especificado y borra el interior
var d = document.getElementById("subcategoria_"+id_cat);
d.innerHTML = "";
}
function quitacategoria(id_cat) {
// Busca el objeto que tiene el numero de categoria especificado y borra el interior
var d = document.getElementById("categoria_"+id_cat);
d.innerHTML = "";
}
</script>
<!-- Parte principal: cuerpo de los formularios -->
<form name="form" action="run.php?op='nueva_categoria'" method="post" enctype="multipart/form-data">
<div id="categorias" name="categorias">
<a href="javascript:nuevacategoria(1)">Añadir una categoria</a>
</div>
<br /><br /><br />
<input type="submit" name="submit" value="Aceptar" class="area">
</form>
</body>
</html>
Muchas Gracias por cualquier ayuda!
<html>
<head>
<script language="javascript">
// CATEGORIAS
//Hay dos tipos de categorias, las categorias principales, y las
//subcategorias (que pueden ser subcategorias de las categorias principales
//o subcategorias de las subcategorias, de forma infinita)
//Variables:
//- num_categoria --> contador para añadir categorias principales
//- veces_cat=0 --> contador para que, cuando se hayan insertado
// previamente categorias, seleccione el maximo identificador
// encontrado en categorias solo una vez en lugar de cada vez
// que se llame a la funcion nuevacategoria y que inserte a
// partir de ese maximo identificador
//- subcat --> vector al que se le referencia a traves de un id de categoria,
// y que contendra el numero de subcategorias que tiene una categoria (o
// una subcategoria)
var num_categoria=1;
var veces_cat=0;
subcat=new Array();
function nuevacategoria(max){
// A esta funcion se le llama solamente en el momento de insertar nuevas categorias principales
//Recibe max, que es el maximo identificador de las categorias existentes
//en la base de datos. Sirve para que los nuevos identificadores continuen
//a partir del maximo, que es un numero entero.
//-----------------------------
//EN ESTE CASO MAX ES SIEMPRE 1
//-----------------------------
//Asigna el maximo al identificador de categoria (o numero de categoria)
//solamente si es la primera vez que se ha accedido a la funcion
veces_cat++;
if(veces_cat==1){
num_categoria=max;
}
// Se busca el objeto de la pagina que tenga como nombre "categorias", que es una capa
var categorias = document.getElementById("categorias");
//Se introduce codigo HTML en esa capa, que se trata de otra capa con el nombre igual al numero
//de categoria que se va a insertar en la bd
categorias.innerHTML+="<div id=categoria_"+num_categoria+">";
var categoria = document.getElementById("categoria_"+num_categoria+"");
// Dentro de esa nueva capa se introduce:
//- Campo de texto de formulario con el numero de la categoria como indetificador
//- Links a funciones de JavaScript para insertar nuevas subcategorias a la categoria actual,
//y para eliminarla (la categoria actual). A estas funciones se les pasa el numero de categoria actual
//- Otra nueva capa donde se insertaran las posibles subcategorias de la subcategoria actual
//con el identificador de la nueva categoria
categoria.innerHTML+="<br>";
categoria.innerHTML+=""+num_categoria+". <input type=text id="+num_categoria+" name="+num_categoria+">";
categoria.innerHTML+=" <a href='javascript:nuevasubcategoria("+num_categoria+",0)'>Añadir subcategoria</a>";
categoria.innerHTML+=" <a href='javascript:quitacategoria("+num_categoria+")'>Eliminar</a>";
categoria.innerHTML+="<div id=subcategoriasde_"+num_categoria+"></div>";
num_categoria++;
}
function nuevasubcategoria(id_cat,max){
// A esta funcion se le llama cada vez que se quiera insertar una nueva subcategoria
//Recibe el identificador o numero de la categoria a la que se le va a insertar una subcategoria
//y el numero de subcategorias que ya tenga (solo en el caso de estar editando, si la categoria
//principal es nueva, max vale 0
//Fuerzo al identificador recibido que sea de tipo texto
id_cat=""+id_cat
//for(i=0;i<=max;i++){
// Si en el vector subcat ya existe una referencia del identificador de categoria,
//incrementa el valor, en caso contrario, lo inicializa a 1
//Se repite tantas veces como valga max, para conseguir, en el caso de estar editando,
//que el identificador de la subcategoria comience despues del maximo valor de
//subcategoria que exista en la base de datos
if(subcat[id_cat]){
subcat[id_cat]++;
}else{
subcat[id_cat]=1;
}
//}
// num_subcategoria identificara a las nuevas subcategorias
//se crea a partir del identificador de la categoria superior,
//con el numero de subcategoria.
//----------------------------------------------------------------------------------------------------------------------------------------
//En un primer momento pense en utilizar un num_subcategoria de las formas 1, 2, 3... para categorias principales
//11, 12, 13, 14, ... para las subcategorias de "1",
//21, 22, 23, 24, ... para las subcategorias de "2",
//51, 52, 53, 54, ... para las subcategorias de "5" etc.
//111, 112, 113, 114, 115, ... para las subcategorias de "11",
//241, 242, 243, 244, 245, ... etc para las subcategorias de "24",
//y asi sucesivamente.
//El problema es que no se pueden poner mas de nueve subcategorias, ya que al procesar los identificadores en otra pagina
//cuento el numero de digitos, y al poner, por ejemplo, 10 subcategorias a la subcategoria "12", su num_categoria era "1210", y tal y
//como lo proceso en la otra pagina, eso significa que es la subcategoria numero "0" de la subcategoria "121"
//La solucion logica es poner un separador en medio de cada numero, yo me decante por el guion bajo.
//De esta forma quedaria...
//1, 2, 3...
//1_1, 1_2, 1_3, 1_4, ... para las subcategorias de "1",
//2_1, 2_2, 2_3, 2_4, ... para las subcategorias de "2",
//5_1, 5_2, 5_3, 5_4, ... para las subcategorias de "5" etc.
//1_1_1, 1_1_2, 1_1_3, 1_1_4, 1_1_5, ... para las subcategorias de "1_1",
//2_4_1, 2_4_2, 2_4_3, 2_4_4, 2_4_5, ... etc para las subcategorias de "2_4",
//y asi sucesivamente.
//---------------------------------------------------------------------------------------------------------------------------------------
//COMENTAR Y DESCOMENTAR ESTAS LINEAS DE ABAJO PARA PROBAR CON GUION O SIN GUION
//SIN GUIONES
num_subcategoria=id_cat+""+subcat[id_cat];
// Calculamos el numero de espacios que se deben colocar delante de la caja de texto
//En el caso de identificadores sin guiones, calculamos en numero de digitos de num_subcategoria
var n=num_subcategoria;
var num_espacios=0;
while(parseInt(n)!=0){
n=n/10;
num_espacios++;
}
/*
//CON GUIONES
num_subcategoria=id_cat+"_"+subcat[id_cat];
// Calculamos el numero de espacios que se deben colocar delante de la caja de texto
//En el caso de identificadores con guiones, buscamos el numero de guiones de num_subcategoria
var num_espacios=0;
for(i=0;i<num_subcategoria.length;i++){
if(num_subcategoria.charAt(i)=="_"){
num_espacios++;
}
}
*/
// Busca en la pagina el elemento que sea igual a "subcategoriade_" con el id de categoria padre
//para que inserte en ese objeto (que es una capa)
//----------PROBLEMA-------------------------------------------------
//-------------------------------------------------------------------
//Por algun motivo que desconozco, al utilizar el getElementById
//con id_cat contiendo caracteres que no sean numericos, no funciona
//-------------------------------------------------------------------
//----------PROBLEMA-------------------------------------------------
var subcategoriasde = document.getElementById("subcategoriasde_"+id_cat);
// Insertamos una nueva capa para identificar la nueva subcategoria
subcategoriasde.innerHTML+="<div id=subcategoria_"+num_subcategoria+">";
var subcategoria = document.getElementById("subcategoria_"+num_subcategoria);
// Insertamos tantas tabulaciones como guiones existan en el identificador
//de subcategoria para desplazar la caja de texto
for(i=1;i<=num_espacios;i++){
subcategoria.innerHTML+=" ";
}
// Dentro de la nueva capa de subcategoria se introduce:
//- Campo de texto de formulario con el numero de la subcategoria
//- Links a funciones de JavaScript para insertar nuevas subcategorias a la subcategoria actual,
//y para eliminarla (la subcategoria actual). A estas funciones se les pasa el numero de subcategoria actual
//- Una nueva capa donde se insertaran las posibles subcategorias de la subcategoria actual
//con el identificador de la nueva subcategoria
subcategoria.innerHTML+=""+subcat[id_cat]+". <input type=text id="+num_subcategoria+" name="+num_subcategoria+"> ";
subcategoria.innerHTML+=" <a href='javascript:nuevasubcategoria("+num_subcategoria+",0)'>Añadir subcategoria</a>";
subcategoria.innerHTML+=" <a href='javascript:quitasubcategoria("+num_subcategoria+")'>Eliminar</a>";
subcategoria.innerHTML+="<div id=subcategoriasde_"+num_subcategoria+"></div>";
}
function quitasubcategoria(id_cat) {
// Busca el objeto que tiene el numero de subcategoria especificado y borra el interior
var d = document.getElementById("subcategoria_"+id_cat);
d.innerHTML = "";
}
function quitacategoria(id_cat) {
// Busca el objeto que tiene el numero de categoria especificado y borra el interior
var d = document.getElementById("categoria_"+id_cat);
d.innerHTML = "";
}
</script>
<!-- Parte principal: cuerpo de los formularios -->
<form name="form" action="run.php?op='nueva_categoria'" method="post" enctype="multipart/form-data">
<div id="categorias" name="categorias">
<a href="javascript:nuevacategoria(1)">Añadir una categoria</a>
</div>
<br /><br /><br />
<input type="submit" name="submit" value="Aceptar" class="area">
</form>
</body>
</html>
Valora esta pregunta
0