Foros del Web » Programando para Internet » Javascript » Frameworks JS »

generar html con javascript

Estas en el tema de generar html con javascript en el foro de Frameworks JS en Foros del Web. Hola Necesito un poco de ayuda, he estado trabajando con un script y no he llegado a una solucion de lo que quiero, creo que ...
  #1 (permalink)  
Antiguo 07/11/2011, 10:14
 
Fecha de Ingreso: junio-2010
Mensajes: 117
Antigüedad: 13 años, 10 meses
Puntos: 1
generar html con javascript

Hola

Necesito un poco de ayuda, he estado trabajando con un script y no he llegado a una solucion de lo que quiero, creo que ya me estoy desesperando jeje.

El script es para etiquetar en una imagen, pero es administrable, entonces el siguiente codigo se genera con javascript dependiendo de cuantas etiquetas ya haya en la foto, en este caso dos.

Código HTML:
[B]<div id="fn-area-new" class="fn-area" style="left: 244px; top: 149px; width: 50px; height: 50px; margin: 0pt; z-index: 3; cursor: move;">
<div class="fn-note" style="left: 244px; top: 209px; display: block;">
<div class="fn-note-text" style="display: none;">
<div class="fn-note-edit" style="display: block;">
<div class="fn-note-edit-text">
<textarea></textarea>
<input id="oculto" type="hidden" name="oculto" value="3">
<input id="imge1" type="radio" value="1" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
<input id="imge2" type="radio" value="2" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
<input id="imge3" type="radio" value="3" checked="checked" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
</div>
<div>
</div>
</div>[/B]
<div id="fn-area-new" class="fn-area" style="left: 208px; top: 239px; width: 50px; height: 50px; margin: 1px; border: 0px solid rgb(212, 216, 45);">
<div class="fn-note" style="left: 208px; top: 299px; display: none;">
<div class="fn-note-text">
<div class="fn-note-edit">
<div class="fn-note-edit-text">
<textarea></textarea>
<input id="oculto" type="hidden" name="oculto" value="2">
<input id="imge1" type="radio" value="1" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
<input id="imge2" type="radio" value="2" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
<input id="imge3" type="radio" value="3" checked="checked" name="imagen" onchange="javascript:cambiar(this.value);">
<img width="50" height="50" src="../sample_images/3.jpg">
<br>
</div>
<div>
</div>
</div> 

Lo que hace es que al tratar de etiquetar muestra un textarea y un grupo de radiobutton, al igual que un campo oculto, por como maneja el script la creacion del html, todo se duplica, asi como los ids.

Cuando agrego una etiqueta nueva, funciona perfectamente, pero cuando modifico falla, lo que pasa es que para agregar utilizo indices, lo que hago es esto:

cuando voy a agregar una etiqueta nueva guardo en un campo oculto el numero de etiquetas que ya tiene la foto, y cuando selecciono cualquiera de los radiobutton llamo a la funcion:

function cambiar(valor){
var nota = document.getElementById("idactivo").value;
var indi;
if(nota == 0){
indi = 0;
}
else{
var indi = parseInt(nota) - parseInt(1);
}
var elementos = document.getElementsByName("oculto")[indi].value=valor;
}

que lo que hace, es tomar el valor del total de etiquetas existentes y guardarlo en la variable indi (indice), si es cero quiere decir que no hay etiquetas y por lo tanto el indice en el que se agregará será cero, despues guarda el valor del radio en un campo oculto que esta dentro de cada grupo de etiquetas (marque un grupo de etiquetas en negro).

El chiste de esto esta en modificar, no he encontrado la manera de averiguar cual es el indice que se quiere modificar, y por lo tanto cuando escojo un radiobutton me modifica el ultimo indice que se creo y no el que seleccioné:

<div class="fn-note" style="left: 208px; top: 299px; display: none;">
<input id="oculto" type="hidden" name="oculto" value="3">
</div><!--este seria el indice 0-->

<div class="fn-note" style="left: 208px; top: 299px; display: none;">
<input id="oculto" type="hidden" name="oculto" value="3">
</div><!--este seria el indice 1-->

Si selecciono el indice 0 para modificar, y al hacer click en un radiobutton en vez de cambiar el valor del campo oculto del indice 0, cambia el del indice 1, no he encontrado la manera de poder identificar del indice 0 o del 1, ya que al generar los grupos de html todo se genera igual, no puedo hacer algo distintivo de cada grupo.


Espero no haberlos revuelto, y que me puedan ayudar, llevo ya casi una semana, y me esta sacando canas verdes :P

Espero de verdad ayuda, gracias de antemano

Etiquetas: funcion, html, javascript
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 08:07.