FOROS DE INFORMATICA
Noticias: Habilitada la opción de Karma para usuarios con más de 50 mensajes
 
*
Bienvenido(a), Visitante. Por favor, ingresa o regístrate.
¿Perdiste tu email de activación?
Julio 30, 2010, 09:58:32


Ingresar con nombre de usuario, contraseña y duración de la sesión


Páginas: [1] 2
  Imprimir  
Autor Tema: textarea  (Leído 1020 veces)
gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« : Febrero 25, 2010, 04:28:20 »

Holas, pues es que tengo un problema q no hayo la solucion

trato de realizar un chatterbot, que es un bot q simula una conversacion por chat con una persona, realize la pagina con html y la transferencia de entradas y salidas con php, para q todo cargue en la misma pagina, para que simule un chat, use codigo Ajax, pero no logro hacer que el textarea donde sale impresa la conversacion se mantenga al final.

en el textarea imprimo la entrada del usuario y la respuesta del bot, similar a una ventana en msn, y a medida que se agregan lineas, se incrementa el texarea, pero cada vez que imprime una respuesta nueva regresa a la primera posicion la barra de desplazamiento, necesito que se quede o cargue con la barra al final para ver la respuesta mas reciente, no que se regrese al principio a cada respuesta

espero que me entiendan bien, si necesitan saber algo mas pregunten

muchas gracias  Smiley
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #1 : Marzo 01, 2010, 12:16:02 »

Hola, porque no igualas el valor del textarea al valor actual del mismo más lo que quieres añadir, esto debería de ponertelo al final. Como lo estás haciendo tú?

Un saludo
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #2 : Marzo 01, 2010, 06:26:36 »

Hola Etereo

Te adjunto el codigo de mi archivo HTML completo, ralemente no se como hacer lo que comentas, seria modificando el valor de rows? como sabria cual es la longitud actual?

<html>
<head>
<?php
header("Expires: ");
header("Cache-Control: no-cache,must-revalidate");
header("Pragma: no-cache");
?>
<title>Formulario Php</title>
<script language="JavaScript" type="text/javascript" src="ConstructorXMLHttpRequest.js"></script>
<script language="JavaScript" type="text/javascript" src="ClasePeticionAjax.js"></script>
<script language="JavaScript" type="text/javascript" >
function peticion(text){
   var texto="";
   if(document.getElementById('conversacion').value==""){
   texto=text;
   }else{
   texto=document.getElementById('conversacion').value+"\n"+text;
   }   
   document.getElementById('conversacion').value= texto;
   peticion01= new objetoAjax("POST"); //Construimos un objetoAjax que utilizará el método GET
   peticion01.completado = function objetoRequestCompletado01(estado, estadoTexto, respuestaTexto, respuestaXML){
   
   if (respuestaTexto==""){
   respuestaTexto="Por favor reformule su pregunta"
   }
   var actualizar=document.getElementById('conversacion').value+"\nIsaac dice: "+respuestaTexto;
   document.getElementById('conversacion').value =actualizar;
   document.getElementById('pregunta').value="";
   }
   url = "Respuestas.php?pregunta="+text;
   peticion01.coger(url);
}

function Clear(){
   document.getElementById('pregunta').value="";
   document.getElementById('conversacion').value="";
   }
</script>
</head>
<body>
<h1>Chatterbot Isaac</h1><br>
Su Dialogo:<br>

<textarea id="conversacion" cols="40" rows="5" name="conversacion" readonly="readonly"></textarea><br>
Ingrese Su Pregunta:<br>
<input type="text" name="pregunta" id="pregunta">
<br>
<input type="submit" value="Enviar" onClick="peticion(document.getElementById('pregunta').value)"><br>
<input type="submit" value="Clear" onClick="Clear()"><br>
</body>
</html>
 
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #3 : Marzo 02, 2010, 10:15:14 »

Ahí lo tienes, es la función setCaretPosition, le pasas el id del textarea y el tamaño del texto que contiene,

http://blog.josh420.com/archives/2007/10/setting-cursor-position-in-a-textbox-or-textarea-with-javascript.aspx

Un saludo
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #4 : Marzo 03, 2010, 07:19:54 »

gracias por tu sugerencia Etereo, inclui la funcion la subraye en negrita, y le hice los cambios q aplicaban (reemplazar el elemId por el ID del textarea en mi caso 'conversacion', y el caretPos por 250 un valor que coloque por probar), pero no me funcional, podrias revisar cual seria el fallo?  Smiley

este  range.move('character', 250); ese 'character' ya estaba en la funcion como estaba en la pagina, como no indicaba no lo modifique y no funciono, probe colocarle el 'conversacion' pero tampoco funciona

<html>
<head>
<?php
header("Expires: ");
header("Cache-Control: no-cache,must-revalidate");
header("Pragma: no-cache");
?>
<title>Formulario Php</title>
<script language="JavaScript" type="text/javascript" src="ConstructorXMLHttpRequest.js"></script>
<script language="JavaScript" type="text/javascript" src="ClasePeticionAjax.js"></script>
<script language="JavaScript" type="text/javascript" >
function peticion(text){
   var texto="";
   if(document.getElementById('conversacion').value==""){
   texto=text;
   }else{
   texto=document.getElementById('conversacion').value+"\n"+text;
   }   
   document.getElementById('conversacion').value= texto;
   peticion01= new objetoAjax("POST"); //Construimos un objetoAjax que utilizará el método GET
   peticion01.completado = function objetoRequestCompletado01(estado, estadoTexto, respuestaTexto, respuestaXML){
   
   if (respuestaTexto==""){
   respuestaTexto="Por favor reformule su pregunta"
   }
   var actualizar=document.getElementById('conversacion').value+"\nIsaac dice: "+respuestaTexto;
   document.getElementById('conversacion').value =actualizar;
   document.getElementById('pregunta').value="";
   }
   url = "Respuestas.php?pregunta="+text;
   peticion01.coger(url);
}

function Clear(){
   document.getElementById('pregunta').value="";
   document.getElementById('conversacion').value="";
   }
   
function setCaretPosition('conversacion', 250) {
    var elem = document.getElementById('conversacion');
   elem.scrolldown = 250;
    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', 250);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(250, 250);
            }
            else
                elem.focus();
        }
   }
}
   
</script>
</head>
<body>
<h1>&nbsp;</h1>
<h1 align="center">Chatterbot Isaac</h1>
<div align="center"><br>
  Su Dialogo:<br>
  <textarea id="conversacion" cols="40" rows="5" name="conversacion" readonly="readonly"></textarea>
  <br>
  Ingrese Su Pregunta:<br>
  <input type="text" name="pregunta" id="pregunta">
  <br>
  <input type="submit" value="Enviar" onClick="peticion(document.getElementById('pregunta').value)">
  <br>
  <input type="submit" value="Clear" onClick="Clear()">
  <br>
</div>
</body>
</html>
« Última modificación: Marzo 03, 2010, 07:21:55 por gasg5000 » En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #5 : Marzo 04, 2010, 09:09:31 »

dónde estás ejecutando la función? No tienes que poner directamente el id, es en la llamada donde lo tienes que poner.

La función es así,

function setCaretPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}


y la llamas así,

setCaretPosition('conversacion', 250);

Un saludo
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #6 : Marzo 05, 2010, 04:52:56 »

Muchas gracias por tus indicaciones, corregi lo que me indicaste, pero aun no realiza lo que nesecito, aun el textarea no se desplaza al final  Cry

podrias revisar de nuevo a ver si observas algo que me pueda ayudar? gracias

<html>
<head>
<?php
header("Expires: ");
header("Cache-Control: no-cache,must-revalidate");
header("Pragma: no-cache");
?>
<title>Formulario Php</title>
<script language="JavaScript" type="text/javascript" src="ConstructorXMLHttpRequest.js"></script>
<script language="JavaScript" type="text/javascript" src="ClasePeticionAjax.js"></script>
<script language="JavaScript" type="text/javascript" >

setCaretPosition('conversacion', 5000);

function peticion(text){
   var texto="";
   if(document.getElementById('conversacion').value==""){
   texto=text;
   }else{
   texto=document.getElementById('conversacion').value+"\n"+text;
   }   
   document.getElementById('conversacion').value= texto;
   peticion01= new objetoAjax("POST"); //Construimos un objetoAjax que utilizará el método POST
   peticion01.completado = function objetoRequestCompletado01(estado, estadoTexto, respuestaTexto, respuestaXML){
   
   if (respuestaTexto==""){
   respuestaTexto="Disculpe. Mis respuestas son limitadas. Por favor reformule su pregunta."
   }
   var actualizar=document.getElementById('conversacion').value+"\nIsaac dice: "+respuestaTexto;
   document.getElementById('conversacion').value =actualizar;
   document.getElementById('pregunta').value="";
   }
   url = "Respuestas.php?pregunta="+text;
   peticion01.coger(url);
}

function Clear(){
   document.getElementById('pregunta').value="";
   document.getElementById('conversacion').value="";
   }
   
function setCaretPosition(elemId, caretPos) {
    var elem = document.getElementById(elemId);

    if(elem != null) {
        if(elem.createTextRange) {
            var range = elem.createTextRange();
            range.move('character', caretPos);
            range.select();
        }
        else {
            if(elem.selectionStart) {
                elem.focus();
                elem.setSelectionRange(caretPos, caretPos);
            }
            else
                elem.focus();
        }
    }
}
   
</script>
</head>
<body>
<h1>&nbsp;</h1>
<h1 align="center">Chatterbot Isaac</h1>
<div align="center"><br>
  Su Dialogo:<br>
  <textarea id="conversacion" cols="50" rows="20" name="conversacion" readonly="readonly"></textarea>
  <br>
  Ingrese Su Pregunta:<br>
  <input type="text" size="50" name="pregunta" id="pregunta">
  <br>
  <input type="submit" value="Enviar" onClick="peticion(document.getElementById('pregunta').value)">
  <br>
  <input type="submit" value="Clear" onClick="Clear()">
  <br>
</div>
</body>
</html>
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #7 : Marzo 05, 2010, 09:40:15 »

La llamada a la función si la pones ahí sólo se ejecuta cada vez que refrescas la página pero no cada vez que envías un texto, ya que el envio se hace en cliente y no pasa por la ejecución de la función 'setCaretPosition'. Pon la llamada al final del método 'peticion'.

Un saludo
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #8 : Marzo 10, 2010, 09:17:20 »

Hola Etero

Disculpa que no halla respondido he estado algo ocupado, finalmente prove tus sugerencias y funciona  Cheesy Cheesy Cheesy Cheesy Cheesy

Muchas gracias

Solo un pequeño detalle, esto funcion en Internet Explorer, en Firefox no,  Angry  tienes alguna idea de porque?

de nuevo un millon de gracias
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #9 : Marzo 11, 2010, 08:59:33 »

te da algún error?
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #10 : Marzo 11, 2010, 03:55:18 »

relamente no que pueda observar, simplemente funciona como funcionaba antes, dejando la barra de desplazamiento del cuadro de texto arriba
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #11 : Marzo 11, 2010, 04:04:01 »

No te da ningún error de javascript al ejecutarlo en firefox?
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #12 : Marzo 12, 2010, 07:08:23 »

No, no me da ningun error observable, tampoco en la consola de errores de firefox dice ningun error, hay alguna otra manera de ver algun error q me estoy saltando?
En línea
Etereo
Global Moderator
Habitante
*****

Karma: 4
Desconectado Desconectado

Mensajes: 1628



« Respuesta #13 : Marzo 15, 2010, 09:09:36 »

Cual es la parte que no te funciona en firefox?
En línea

gasg5000
Nuevo
*

Karma: 0
Desconectado Desconectado

Mensajes: 37



« Respuesta #14 : Marzo 16, 2010, 07:51:27 »

que la barra de desplazamiento no baja cuando entra texto que supera el textarea, debe uno manualmente hacer click y arrastrarla hacia abajo para ver el texto nuevo que salio en el textarea  Cry como funcionaba siempre, el arreglo que me indicaste funciona en IE pero en firefox es como si no le hubiera modificado nada
En línea
Páginas: [1] 2
  Imprimir  
 
Ir a:  

Impulsado por MySQL Impulsado por PHP Powered by SMF 1.1.10 | SMF © 2006-2009, Simple Machines LLC

XHTML 1.0 válido! CSS válido! Dilber MC Theme by HarzeM
eSedo.com - Compra, venta y registro de dominios y proyectos web infos proyecto: forosdeinformatica.com estadísticas para proyecto: forosdeinformatica.com etracker® web controlling en lugar de analisis de archivos log