Duda crear una lista en javascript

[ferrec]

Buenas noches, ante todo quiero felicitaros por este gran foro que he ido aprendiendo poco a poco leyendo a todos vosotros...

tengo una pregunta...me estoy iniciando en java scrip y creo que me he encasillado en algo sencillo pero no se como salir...

Estoy haciendo pruebas con el ejemplo de [URL="https://developers.google.com/maps/articles/phpsqlsearch_v3?hl=es"]Google maps[/URL] ya tengo montado todo perfectamente, lo unico que deseo hacer es una lista con los resultados....En el ejemplo de google hay una lista desplegable, pero la que yo quiero es un listado normal.

Este es el codigo donde creo que esta el listado que os digo ...por favor a ver si me podeis echar una mano:


<div><select id="locationSelect" style="width:100%;visibility:hidden"></select></div>

....

var locationSelect;



locationSelect = document.getElementById("locationSelect");
locationSelect.onchange = function() {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
if (markerNum != "none"){
google.maps.event.trigger(markers[markerNum], 'click');
....

locationSelect.innerHTML = "";
var option = document.createElement("option");
option.value = "none";
option.innerHTML = "See all results:";
locationSelect.appendChild(option);


Muchas gracias a todos

[cuasatar]

En el ejemplo de google hay una lista desplegable, pero la que yo quiero es un listado normal

Coincidencialmente yo estoy haciendo un trabajo en google maps y he visto el mismo ejemplo para guiarme y realizar una cosa parecida pero diferente.
¿A que te refieres con hacer un listado normal en lugar de una lista desplegable?

[emprear]

Iniciado por ferrec

Buenas noches, ante todo quiero felicitaros por este gran foro que he ido aprendiendo poco a poco leyendo a todos vosotros...

tengo una pregunta...me estoy iniciando en java scrip y creo que me he encasillado en algo sencillo pero no se como salir...

Estoy haciendo pruebas con el ejemplo de [URL="https://developers.google.com/maps/articles/phpsqlsearch_v3?hl=es"]Google maps[/URL] ya tengo montado todo perfectamente, lo unico que deseo hacer es una lista con los resultados....En el ejemplo de google hay una lista desplegable, pero la que yo quiero es un listado normal.

Este es el codigo donde creo que esta el listado que os digo ...por favor a ver si me podeis echar una mano:


<div><select id="locationSelect" style="width:100%;visibility:hidden"></select></div>

....

var locationSelect;



locationSelect = document.getElementById("locationSelect");
locationSelect.onchange = function() {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
if (markerNum != "none"){
google.maps.event.trigger(markers[markerNum], 'click');
....

locationSelect.innerHTML = "";
var option = document.createElement("option");
option.value = "none";
option.innerHTML = "See all results:";
locationSelect.appendChild(option);


Muchas gracias a todos

Primero, el select lo crea acá

Código:

function createOption(name, distance, num) {  var option = document.createElement("option");  option.value = num;  option.innerHTML = name + "(" + distance.toFixed(1) + ")";  locationSelect.appendChild(option);}

Tendrías que hacer algo asi
en lugar de un select, poner las opciones generadas dentro de una lista <ul>, con lo cual ya no crearías options sino <li>
var option = document.createElement("LI");

El problema sería que ya no tendrías los value para recuperar el dato seleccionado, asi que deberías recurrir a otro método para obtenerlo, podría ser, y es solo una idea, con el atributo title, ejemplo

Código:

var lista = document.createElement("LI");
lista.title= num;
lista.innerHTML = name+ "(" + distance.toFixed(1) + ")";  
lista.onclick = function(){
// aqui adaptás para que haga lo que actualmente hace locationSelect.onchange
}

Se entiende?
Saludos

[cuasatar]

Gracias a emprear entendi a que te referias con una lista. En este mapa encuentras una solución que tienes listas. Precisamente es la que estoy adaptando a mis necesidades.

La solución es diferente y es en jquery pero seguro te dara ideas junto a lo de emprear y asi tu crearas tu propia solución. Ironicamente aun no doy con el problema de colocar las imagenes de los marcadores de manera dinamica usando ajax. Ojala se me ilumine el cerebro para crear la solución.

http://css-tricks.com/google-maps-slider/