Foros del Web » Programando para Internet » Javascript »

[SOLUCIONADO] div pierde su css cuando se le asigna innerHTML

Estas en el tema de div pierde su css cuando se le asigna innerHTML en el foro de Javascript en Foros del Web. buen dia, tengo un div con las siguientes clases en una hoja de estilo: .Tcontenido { overflow:hidden; white-space: nowrap; text-overflow: ellipsis; } .Tnombre { width:200px; ...
  #1 (permalink)  
Antiguo 11/06/2013, 23:59
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
div pierde su css cuando se le asigna innerHTML

buen dia, tengo un div con las siguientes clases en una hoja de estilo:

.Tcontenido
{
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

.Tnombre
{
width:200px;
}

este div pertenece a una tabla que me traigo con ajax y al principio me lo muestra bien si el valor es rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr en el div me aparece rrrrrrrrrrr... pero por ejemplo si yo le vuelvo a asignar ese valor a su innerHTML en vez de apareserme rrrrrrrr... me aparece rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr rrrrr como que pierde su estilo, que podria ser?
  #2 (permalink)  
Antiguo 12/06/2013, 22:10
Avatar de ggomez91  
Fecha de Ingreso: octubre-2008
Mensajes: 181
Antigüedad: 16 años, 2 meses
Puntos: 13
Respuesta: div pierde su css cuando se le asigna innerHTML

Hum.. podrías dar un ejemplo más explícito que las rrrrr?
  #3 (permalink)  
Antiguo 13/06/2013, 12:35
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
Respuesta: div pierde su css cuando se le asigna innerHTML

ok si yo en ese div tengo

juan enrique alberto torres fuentes

cuando reciente me traigo la tabla si respeta el estilo y aparece como

juan enrique al...

yo le doy al usuario la opcion de modificar el nombre y con ajax lo modifico en la bdd y en vez de traerme toda la tabla solo mando un correcto, y copio el nombre que puso en el input text en el div

si por ejemplo era

juan enrique alberto torres fuentes

en el div aparecia como

juan enrique al...

si por ejemplo el usuario le dio modificar y cambio o no yo le reasigno su valor al div y en vez de aparecer

juan enrique al...

aparece

juan enrique alberto torres fuentes

y pues se me deforma toda la tabla
  #4 (permalink)  
Antiguo 13/06/2013, 12:41
Avatar de ggomez91  
Fecha de Ingreso: octubre-2008
Mensajes: 181
Antigüedad: 16 años, 2 meses
Puntos: 13
Respuesta: div pierde su css cuando se le asigna innerHTML

Cómo estás llenando el div con los datos del input? puedo ver ese código?
Prueba con el inspector a ver si se siguen aplicando tus reglas css en el div. Ve si esto cambia al dar click en el botón.
  #5 (permalink)  
Antiguo 13/06/2013, 22:30
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
Respuesta: div pierde su css cuando se le asigna innerHTML

<script>
var formulario="";
var copia_nombre="";
var copia_titulo="";
var copia_visible="";
var copia_materias=new Array();

function habilitar_modificar(numero)
{
formulario=numero;
copiar_datos(numero);

document.getElementById("modificar"+numero).style. display="none";
document.getElementById("aceptar"+numero).style.di splay="inline";
document.getElementById("cancelar"+numero).style.d isplay="inline";
document.getElementById("tabla-nombre"+numero).style.display="none";
document.getElementById("tablaTextbox-nombre"+numero).style.display="inline";
}

function cancelar_modificar(numero)
{
formulario="";
reponer_datos(numero);

document.getElementById("modificar"+numero).style. display="inline";
document.getElementById("aceptar"+numero).style.di splay="none";
document.getElementById("cancelar"+numero).style.d isplay="none";
document.getElementById("tablaTextbox-nombre"+numero).style.display="none";
document.getElementById("tabla-nombre"+numero).style.display="inline";
}

function copiar_datos(numero)
{
copia_nombre=document.getElementById("tablaTextbox-nombre"+numero).value;
}

function reponer_datos(numero)
{
document.getElementById("tablaTextbox-nombre"+numero).value=copia_nombre;
}

function cambio_tablaCliente(numero)
{
document.getElementById("tabla-nombre"+numero).innerHTML=copia_nombre;
document.getElementById("tabla-nombre"+numero).title=copia_nombre;
}

function tabla_cambiar(numero)
{
copiar_datos(numero);
cambio_tablaCliente(numero);
cancelar_modificar(numero);
formulario="";
}

</script>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<style type="text/css">
.Tcontenido
{
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

.Tnombre
{
width:200px;
}
</style>
</head>
<div id="tabla-nombre0" class="Tnombre Tcontenido" title="ndvdofnvofnlnvlneflvnelfvnelknrvfoefivnfvkl nlkfnvklfnvlknldsfnd">
ndvdofnvofnlnvlneflvnelfvnelknrvfoefivnfvklnlkfnvk lfnvlknldsfnd
</div>
<input id="tablaTextbox-nombre0" type="text" maxlength="256" value="ndvdofnvofnlnvlneflvnelfvnelknrvfoefivnfvkl nlkfnvklfnvlknldsfnd" style="display:none;">


<img id="modificar0" src="img/modificar.png" title="Modificar" onclick="habilitar_modificar('0')">
<img id="aceptar0" src="img/aceptar.png" title="Aceptar" style="display:none;" onclick="tabla_cambiar('0')">
<img id="cancelar0" src="img/cancelar.png" title="Cancelar" style="display:none;" onclick="cancelar_modificar('0')">
  #6 (permalink)  
Antiguo 13/06/2013, 22:31
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
Respuesta: div pierde su css cuando se le asigna innerHTML

realmente mi codigo es mas extenso pero puse lo que pienso es esencial y se puede apreciar el error.
  #7 (permalink)  
Antiguo 14/06/2013, 01:08
Avatar de danny_  
Fecha de Ingreso: septiembre-2012
Mensajes: 95
Antigüedad: 12 años, 3 meses
Puntos: 4
Respuesta: div pierde su css cuando se le asigna innerHTML

Primer fallo que hallo

document.getElementById("aceptar"+numero).style.di splay="none";
document.getElementById("cancelar"+numero).style.d isplay="none";

display va junto, tu has escrito dis play. Haz uso de firebug, te ahorrará mas de un dolor de cabeza...
  #8 (permalink)  
Antiguo 14/06/2013, 01:36
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
Respuesta: div pierde su css cuando se le asigna innerHTML

muchas gracias, pero noc porque aqui lo puso asi yo en mi codigo si lo tengo junto, de hecho el problema es lo del estilo del div eso donde aparecio separado es para ocultar las imagenes de aceptar y cancelar, cosa que si me funciona jajaja que loco de hecho en ambos metodos lo hizo en cancelar_modificar y habilitar_modificar y no solo esas lineas tambien en

document.getElementById("modificar"+numero).style. display="none";

puso un espacio entre el . y la palabra display
  #9 (permalink)  
Antiguo 14/06/2013, 06:55
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 6 meses
Puntos: 834
Respuesta: div pierde su css cuando se le asigna innerHTML

El problema no está en innerHTML. El problema es que estás cambiando la propiedad display a inline. Para que funcione el valor ellipsis de la propiedad text-overflow deberías usar un valor de display que sea block o inline-block.
  #10 (permalink)  
Antiguo 14/06/2013, 12:19
 
Fecha de Ingreso: mayo-2011
Mensajes: 32
Antigüedad: 13 años, 7 meses
Puntos: 1
Respuesta: div pierde su css cuando se le asigna innerHTML

si era eso, muchas gracias

Etiquetas: ajax, css, html, innerhtml, pierde
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 01:21.