Lograr salto de linea automatico en textarea

Citar

Escrito el 19 Ene 2012 05:36 pm

Hola a todos,
Mi problema es el siguiente: tengo un formulario con un textarea, dentro de el tengo integrado un editor de texto (ckeditor) con un botón de submit para guardar el código html generado por el editor en la base de datos. Hasta ahí todo bien, el problema realmente surge cuando quiero mostrarlo en un div.
En el editor cuando se termina el ancho para escribir una linea y pasa a la de abajo, este no genera ningún tipo de código
Entonces al insertar el contenido de la base de datos al div, el texto sobrepasa el ancho de este y sale de sus limites.
La única solución que he observado es darle al editor de texto el mismo ancho que el div, escribir el contenido hasta casi sobrepasar el ancho máximo de caracteres de la linea y ahí insertar manualmente un salto de linea, apretando ENTER o SHIFT+ENTER. Pero esto no es lo que quiero, lo que necesito es que se genere un código cada ves que el editor pase a la siguiente linea.

Espero que me puedan ayudar con este problema,

Muchas gracias

Por bru-1

2 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 19 Ene 2012 06:16 pm

Me parece que en este caso deberías de revisar más el diseño de tu página en lugar de el funcionamiento del editor. Algunos consejos:

Dale al div un ancho fijo y asegurate de que la propiedad overflow este en auto o en visible
Asegurate de que el texto que proviene del editor venga organizado en párrafos

No se necesita de ningún código especial para que las líneas hagan un salto de línea cuando se termina el espacio, esto lo hacen los navegadores automáticamente. Si tu web no lo hace, entonces es porque algo en el diseño de tu sitio cambio esta funcionalidad.

Por Odin

Claber

639 de clabLevel

2 tutoriales

Genero:Masculino Premio_Secretos

Envíale un mensaje privado Web

El valle de las hamacas

@odinjv

Citar

Escrito el 19 Ene 2012 07:10 pm

Hola Odin, gracias por responder.

Tuve en cuenta lo que me dijiste, el div esta definido con ancho fijo.
Las propiedades del div son las siguientes.

#barra_medio
{
width: 678px;
height: auto;
overflow:auto;
border-left:1px solid #181818;
border-right:1px solid #181818;
background-color: #E0E1E3;
text-indent: 1.5em;
}

Saque 2 screenshots para mostrarte mejor lo que no quiero que suceda.

Imagen 1: con overflow:auto;

Lo que busco es no aparezca el overflow horizontal, y en ves de eso cuando se termine el ancho del div salte a una nueva linea.
He buscado soluciones, y solo he encontrado que sugerian que use la funcion php nl2br, pero en mi caso no me sirve, ya que los datos que se guardan en la BD no contienen "\n" que es el codigo que utiliza el textarea para indicar un salto de linea.

Imagen 2: sin overflow.

El codigo que se almacena en la base de datos es asi:

Código HTML :

<html>
   <head>
      <title></title>
   </head>
   <body>
      <p>
      aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa ...
                </p>
   </body>
</html>

Y que luego lo muestro de esta manera en el div:

Código HTML :

      <?php
      include ("conecxion.php");
      $result = mysql_query("SELECT * FROM novedades_home ORDER BY id ASC");
      while($resultado = mysql_fetch_assoc($result))
                {
         echo"
         <div id='barra_medio'>
         <br>
         " . $resultado['cuerpo'] . "
         </div>
                        <br>";
      }
      ?>

Por bru-1

2 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 19 Ene 2012 09:10 pm

tu problema es que estas utilizando una sola palabra (aaaaaaaaaaaaaaaaaaaaaaaaaa), el sistema no va a dividir una palabra entera automáticamente. Te recomiendo que hagas pruebas con parrafos de texto, por ejemplo lorem ipsum para que veas mejor como se vería el contenido.

Por Odin

Claber

639 de clabLevel

2 tutoriales

Genero:Masculino Premio_Secretos

Envíale un mensaje privado Web

El valle de las hamacas

@odinjv

Citar

Escrito el 20 Ene 2012 07:27 am

Gracias por tu ayuda Odin

Por bru-1

2 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 20 Ene 2012 05:42 pm

Digo lo mismo que Odin
Pero si aun asi esta el problema intenta darle formato al CSS para delimitar de igual modo utiliza el ckeditor para que guarde el formate en la DB y al mostrarlo lo vuelque como HTML

Por dsalcedo