Ingresar etiquetas html desde un boton a area de texto

baxi2990 · #1 (**permalink**) 23/09/2008, 18:31

Hola amigos, quisiera saber si es posible asignarle un valor constante a un boton para que a la hora de presionalo me ponga etiquetas html en la posicion actual del cursor de mi area de texto como las que aparecen aca en el foro si apachamos el boton de negrita nos pone el codigo "" lo mismo quisiera hacer para negrita, cursiva, subrayadom, vinculo y imagen agradesco la ayuda.

pabloturchi · #2 (**permalink**) 23/09/2008, 18:36

Hopla, esto que decis no se hace en PHP. No te olvides que PHP es un lenguaje del lado del servidor. Cuando tenes un boton y lo presionas, estas del lado del cliente y ya no tenes el PHP. Para usar el PHP deberias recargar la pagina. Pero eso que decis, si bien lo deberias hacer en javascript, que es el lenguaje del lado del cliente, me parece mejor que te descargues de internet algun editor html que puedas agregar a tu pagina. Hay varios y gratis. Ahora mismo no recuerdo donde pero podes buscarlo en google como editor html para gregar a la pagina o algo asi. Suerte !!!!

baxi2990 · #3 (**permalink**) 23/09/2008, 18:59

Gracias por la respuesta, entonces que hago ahora pasar el tema a javascript? ya que mis paginas donde ingreso mi info a mi base de datos estan en php gracias

#4 (**permalink**) 23/09/2008, 19:04

He reportado el tema para que un moderador lo mueva al foro correcto. De moemnto, podría decirte que ya alguien puso una respuesta a tu pregunta en ese foro, nada menos que en sus conocidas FAQs (el primer sitio donde debiste buscar):

Cita:

31.- Textbox con botones para formato (tipo ForosDelWeb) [Ejemplo]
¿Como puedo construir con un texarea y algunos botones una pantalla de captura para que los usuarios escriban un texto y puedan insertar comandos para negritas, subrayado, etc. y que dichos comandos se inserten justo en el punto donde esté el cursor?

Saludos,

baxi2990 · #5 (**permalink**) 23/09/2008, 19:11

Gracias!!!!

Saludos

jam1138 · #6 (**permalink**) 23/09/2008, 19:30

Gracias por el reporte okram

.

baxi2990 · #7 (**permalink**) 23/09/2008, 22:01

Gracias amigos por la ayuda y por cambiar de lugar mi tema, ahora tengo una duda con el codigo que vi no manejo a la perfeccion javascript y quisiera ver si algien me ayuda tengo el codigo que aparecia en este mismo foro ya lo arregle para que no pida los textos en la caja de dialogo, pero ahora mi duda es como le hago para que me coloque el codigo en la actual posicion del cursor, por ejemplo ingreso una primera etiqueta para negrita y me deja el curso justo donde termina la instruccion pero quiero que mi texto esta con cursiva tendria q poner el cursor en medio de las de negrita pero a la hora que doy clic me lo pone al final de mi ultima linea en este caso despues de las negritas br /br este es el codigo

Código:

<HTML>
 <HEAD>
 </HEAD>
 <BODY>
  <SCRIPT language="Javascript" type="text/javascript">

   // Este genial Script fue desarrollado por Tukzone, SirMatrix y Unknow, 
   // todos usuarios del Foro.. Gracias a ellos por su colaboración

  function storeCaret(text) { 
   if (text.createTextRange) {
    text.caretPos = document.selection.createRange().duplicate();
   }
  }

  function meter(text) {
   var postopic = document.PostTopic.Message;
   if (postopic.createTextRange && postopic.caretPos) {      
    var caretPos = postopic.caretPos;      
    caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? 

text + ' ' : text;
   }
   else postopic.value += text;
   postopic.focus(caretPos)
  }

  function codigo(accion) {
   switch(accion) {
    case "url":
      url="[ a] [ /a]";
      meter(url);
     break;
    case "bold":
      negras="[ b] [ /b]";
      meter(negras);
     break;
    case "italics":
      italics="[ i] [ /i]";
      meter(italics);
     break;
    case "code":
     code="[ code]  [ /code]";
     meter(code);
     break;
    case "quote":
     quote="[ quote]  [ /quote]";
     meter(quote);
     break;
    default:
     meter(accion);
     break;
   }
  }

  function textCounter(field, countfield, maxlimit) {
   if (field.value.length > maxlimit)
    field.value = field.value.substring(0, maxlimit);
   else 
    countfield.value = maxlimit - field.value.length;
  }
 </script>
 <form name="PostTopic">
  Nombre de usuario:
  <INPUT TYPE="text" NAME="UserName" SIZE="12" MAXLENGTH="25" 

VALUE='Kaopectate'> 
  Password:
  <input maxLength="13" name="Password" size="12" type="password" 

VALUE='**********'>
  Mensaje:
  <textarea 

onKeyDown="textCounter(this.form.Message,this.form.remLen,2000);" 

onKeyUp="javascript:storeCaret(this); 

textCounter(this.form.Message,this.form.remLen,2000);" name="Message" 

onchange="javascript:storeCaret(this);" 

onclick="javascript:storeCaret(this);" rows="10" wrap="VIRTUAL" cols="45">
  </textarea>
  <a href="javascript:codigo('url')">Enlace</a> 
  <a href="javascript:codigo('bold')">negrita</a>
  <a href="javascript:codigo('italics')">italica</a> 
  <a href="javascript:codigo('code')">codigo</a>
  <a href="javascript:codigo('quote')">citar</a>
  Tiene
  <input readonly type=text name=remLen size=5 maxlength=3 value="2000">
  caracteres para su mensaje.
 </form>
</BODY>
</HTML>

Agradesco la ayuda