Descripcion en caja de texto con vinculo desde lista desplegable compartida

sasquatch-home · #1 (**permalink**) 27/02/2005, 10:29

Hola muchachos, una vez mas necesito de vuestra ayuda para completar un codigo que logre juntar pero sé que algo falta para q funcione.
El tema es que quiero que la descripcion de de las letras de "MI PRIMER CD" y de "MI SEGUNDO CD" aparezcan en la caja de texto cuando alguien los seleccione, o sea, dependiendo de que "CD" elijan. Por favor ayudenme para poder terminar mi página. Desde ya se los estoy agradeciendo.

Aca les dejo el codigo que fusione entre dos q encontre por una web de Scripts.

Código HTML:

<html>

<head>
<title>Vínculos en lista desplegable + descripción 2</title>
<script language="JavaScript1.2">

 function verifyInput() {
 var aa;
 var s,ss;
 var s = combowithtext.Discos.value; 
 ss = s.split("&");
 for (i = 0; i < ss.length ; i++) {
 combowithtext.letras.options[i].text = ss[i];
 } 
 }
 </script>

</head>

<body>
<center>
<form name="combowithtext">
  <p><select id=Discos name="Discos"  style="HEIGHT: 66px; LIST-STYLE: square;  WIDTH: 155px" size="1" dataFld onChange="verifyInput()">
  <option value="Nombre Canción 1&amp;Nombre Canción 2&amp;Nombre Canción 3">Mi Primer CD</option>
  <option value="Nombre Canción 4&amp;Nombre Canción 5&amp;Nombre Canción 6">Mi Segundo CD</option>
  </select>
  <select id="letras" name="letras"  style="HEIGHT: 66px; LIST-STYLE: square;  WIDTH: 155px" size="1" dataFld onChange="showtext()">
  <option value>Nombre Canción 1</option>
  <option value>Nombre Canción 2</option>
  <option value>Nombre Canción 3</option>
  </select><br>
  <textarea rows="10" cols="36" wrap="virtual" name="text"></textarea>
  <script language="javascript">
<!--

var shortcut=document.combowithtext
var descriptions=new Array()

//extend this list if neccessary to accomodate more selections
descriptions[0]="Letra Nº 1 de "MI PRIMER CD"
descriptions[1]="Letra Nº 2 de "MI PRIMER CD"
descriptions[2]="Letra Nº 3 de "MI PRIMER CD"
descriptions[3]="Letra Nº 1 de "MI SEGUNDO CD"
descriptions[4]="Letra Nº 2 de "MI SEGUNDO CD"
descriptions[5]="Letra Nº 3 de "MI SEGUNDO CD"



shortcut.text.value=descriptions[shortcut.letras.selectedIndex]
function gothere(){
location=shortcut.example.options[shortcut.letras.selectedIndex].value
}

function showtext(){
shortcut.text.value=descriptions[shortcut.letras.selectedIndex]
}
//-->
  </script>
  </p>
</form>
</center>
<p align="center">&nbsp;</p>

</body>

</html>

PD: Lo puse en la seccion JAVASCRIPT y no HTML porque en realidad se que el codigo de Javascript es el que esta incompleto.

SE LOS SUPER AGRADEZCO!!!

Atte. Maximiliano

angsanchez · #2 (**permalink**) 27/02/2005, 15:01

Hola, Maximiliano
Hay un error de comillas:

Cita:

Iniciado por sasquatch-home

descriptions[0]="Letra Nº 1 de "MI PRIMER CD"
descriptions[1]="Letra Nº 2 de "MI PRIMER CD"
descriptions[2]="Letra Nº 3 de "MI PRIMER CD"
descriptions[3]="Letra Nº 1 de "MI SEGUNDO CD"
descriptions[4]="Letra Nº 2 de "MI SEGUNDO CD"
descriptions[5]="Letra Nº 3 de "MI SEGUNDO CD"

Deben ser
descriptions[0]='Letra Nº 1 de "MI PRIMER CD"'

Espero que sea sólo eso; si sigue fallando, dilo y revisamos el resto del código

sasquatch-home · #3 (**permalink**) 27/02/2005, 20:19

Hola Angsanchez, antes q nada te agradezco mucho la pronta participacion q tuviste en mi pregunta. Siguiendo, ese fue un herror mio a las apuradas por escribir el codigo, porque lo habia puesto pero se vé q cuando lo quise modificar de la desesperacion para q se note lo que queria decir le puse otras comillas adelante de MI.

El codigo es uno q hice yo juntando dos q encontre por internet. Habia un codigo que es para solamente seleccionar de la lista deplegable de la izquierda, y se relaciona con la de la derecha. y el otro codigo es uno que despliega una descripcion del elemento que se selecciona de la lista.

Quise juntar los dos para hacer lo siguiente:

Código:

     ___________________                        ___________________________
    |Mi primer CD  | \/ |  se relaciona con ->  |Letras de Mi primer CD| \/ |
     --------------------                       -----------------------------

                   y en este cuadro apareceria la letra del tema

         ____________________________________________________
        |                                                                                   |
        |   primera frase del tema 1                                                |
        |   segunda frase                                                              |
        |                                                                                   |
        |                                                                                   |
        |                                                                                   |
         ------------------------------------------------------------

Algo asi es lo que quiero, pero lo que no logro hacer es relacionar las descripciones de las letras de MI SEGUNDO CD en el cuadro de texto.

Perdon que no puse este ejemplo antes pero es que estaba super apurado para ir a ensayar y se me hacia muy tarde.

GRACIAS!
Atte. Maximiliano

sasquatch-home · #4 (**permalink**) 28/02/2005, 11:27

Alguien que me ayude por favor!!!!!

Gracias!

angsanchez · #5 (**permalink**) 28/02/2005, 14:30

Hola de nuevo. Te pongo en rojo los cambios que hay que hacer:

Código:

 function verifyInput() {
           (....etc)
 var s = document.combowithtext.Discos.value; 
document.combowithtext.letras.options[i].text 
           (....etc)

(esto no era la causa del error, pero es mejor así por compatibilidad)

Código:

//extend this list if neccessary to accomodate more selections
descriptions[0]=new Array()
descriptions[0][0]="Letra Nº 1 de MI PRIMER CD"
descriptions[0][1]="Letra Nº 2 de MI PRIMER CD"
descriptions[0][2]="Letra Nº 3 de MI PRIMER CD"
descriptions[1]=new Array()
descriptions[1][0]="Letra Nº 1 de MI SEGUNDO CD"
descriptions[1][1]="Letra Nº 2 de MI SEGUNDO CD"
descriptions[1][2]="Letra Nº 3 de MI SEGUNDO CD"
shortcut.text.value=descriptions[shortcut.Discos.selectedIndex][shortcut.letras.selectedIndex]

Necesitas una matriz bidimensional porque tienes 2 grupos de 3 opciones, no 6 opciones. Éste era el problema.

Código:

function showtext()
{ 
shortcut.text.value=descriptions[shortcut.Discos.selectedIndex][shortcut.letras.selectedIndex] 
}

Ahora espero que funcione como querías. Aún hay un problema de coordinación, porque el texto sólo se actualiza cuando eliges canción, pero si cambias disco no se actualiza automáticamente. Eso se puede hacer con un poco más de trabajo. Primero, mira si funciona como querías.

sasquatch-home · #6 (**permalink**) 28/02/2005, 21:01

Hola angsanches, así como esta este código es como me dijiste que lo haga, pero aun asi no funciona, a penas pongo vista previa en el frontpage me aparece un error que dice que en la linea 42 caracter 1 no esta definido el 'array'

Código HTML:

<html>

<head>
<title>Vínculos en lista desplegable + descripción 2</title>
<script language="JavaScript1.2">

 function verifyInput() {
 var aa;
 var s,ss;
 var s = document.combowithtext.Discos.value; 
 ss = s.split("&");
 for (i = 0; i < ss.length ; i++) {
 document.combowithtext.letras.options[i].text = ss[i];
 } 
 }
 </script>

</head>

<body>
<center>
<form name="combowithtext">
  <p><select id=Discos name="Discos"  style="HEIGHT: 66px; LIST-STYLE: square;  WIDTH: 155px" size="1" dataFld onChange="verifyInput()">
  <option value="Nombre Canción 1&amp;Nombre Canción 2&amp;Nombre Canción 3">Mi Primer CD</option>
  <option value="Nombre Canción 4&amp;Nombre Canción 5&amp;Nombre Canción 6">Mi Segundo CD</option>
  </select>
  <select id="letras" name="letras"  style="HEIGHT: 66px; LIST-STYLE: square;  WIDTH: 155px" size="1" dataFld onChange="showtext()">
  <option value>Nombre Canción 1</option>
  <option value>Nombre Canción 2</option>
  <option value>Nombre Canción 3</option>
  </select><br>
  <textarea rows="10" cols="36" wrap="virtual" name="text"></textarea>
  <script language="javascript">
<!--

var shortcut=document.combowithtext
var descriptions=new Array()

//extend this list if neccessary to accomodate more selections
descriptions[0]=new array()
descriptions[0][0]="Letra Nº 1 del primer CD"
descriptions[0][1]="Letra Nº 2 del primer CD"
descriptions[0][2]="Letra Nº 3 del primer CD"
descriptions[1]=new array()
descriptions[1][0]="Letra Nº 4 del segundo CD"
descriptions[1][1]="Letra Nº 5 del segundo CD"
descriptions[1][2]="Letra Nº 6 del segundo CD"
shortcut.text.value=descriptions[shortcut.Discos.selectedIndex][shortcut.letras.selectedIndex]
function gothere(){
location=shortcut.letras.options[shortcut.letras.selectedIndex].value
}

function showtext()
{
shortcut.text.value=descriptions[shortcut.Discos.selectedIndex][shortcut.letras.selectedIndex]
}
//-->
  </script>
  </p>
</form>
</center>
<p align="center">&nbsp;</p>

</body>

</html>

Te agradeceria si te podes fijar q estoy haciendo mal, si a vos te andubo quisiera saber si podrias pegar el codigo completo porque yo no encuentro manera de hacerlo funcionar. GRACIAS

atte. Maximiliano

sasquatch-home · #7 (**permalink**) 02/03/2005, 10:19

Alguien que sepa donde puedo conseguir este código ya diseñado? donde solo me reste cambiar las descripciones y eso??

Gracias

angsanchez · #8 (**permalink**) 02/03/2005, 14:31

Hola
Parece que sólo es poner "Array" con mayúscula y se arregla

sasquatch-home · #9 (**permalink**) 02/03/2005, 21:20

SOS EL MEJORRRRRRRRRRRRRRR!!!!!!!!GRACIAS MIL GRACIAS!!!! MILLON DE GRACIAS!!! AHORA SI!!!! Voy a poder empezar la seccion de letras de la pagina para poder terminarla de una buena vez!!!! ANGSANCHEZ!!! SOS EL MAS CAPO! jjajajajaj sii sos un genio y.. te podria compenzar con una cuenta de GMAIL si es que no tenes! Yo te la regalo, solo dejame tu mail que te la envio ahi!

Mil gracias millones!
Atte. Maximiliano

angsanchez · #10 (**permalink**) 03/03/2005, 16:07

No hay de qué.
Ya tengo cuenta, muchas gracias.
¿El FrontPage no te advierte de los errores de sintaxis? Otros editores te marcan de un color las instrucciones reconocidas y, si las escribes mal, pues se quedan en negro, con lo cual es más fácil ver cuándo se te ha ido el dedo.
Suerte con tu proyecto.