select dinamiche e invio parametri

[nico.gaglia]

purtroppo non posso con un link... sono in locale comunque ti posto il file ajax_req.js che includo nell'head della pagina di registrazione.

sull'onchange della combo delle province chiamo il metodo

onchange="htmlData('phpUtils/comuni.php', 'ch='+this.value)"

ma come abbiamo visto, i parametri li passa correttamente. comuni.php è il file che ho postato all'inizio, grazie ancora

// JavaScript Document

function GetXmlHttpObject(handler)
{
    var objXMLHttp=null
    if (window.XMLHttpRequest)
    {
        objXMLHttp=new XMLHttpRequest()
    }
    else if (window.ActiveXObject)
    {
        objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
    }
    return objXMLHttp
}

function stateChanged()
{
    if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
    {
            document.getElementById("txtResult").innerHTML= xmlHttp.responseText;
    }
    else {
            //alert(xmlHttp.status);
    }
}

// Will populate data based on input
function htmlData(url, qStr)
{
    if (url.length==0)
    {
        document.getElementById("txtResult").innerHTML=""; 
        return;
    }
    xmlHttp=GetXmlHttpObject()
    if (xmlHttp==null)
    {
        alert ("Browser does not support HTTP Request");
        return;
    }

    url=url+"?"+qStr; 
    url=url+"&sid="+Math.random();
    xmlHttp.onreadystatechange=stateChanged;
    xmlHttp.open("GET",url,true) ;
    xmlHttp.send(null);
}

[nico.gaglia]

non so se può esserti di aiuto:

nella form di registrazione ho rispettivamente:

-provincia
-comune
-indirizzo (testo libero) con un evento onblur="showAddress()"

tale metodo si trova nel googleUtils.js...

<tr>
                <td nowrap="nowrap" align="right"><label class="label">Indirizzo</label></td>
                <td nowrap="nowrap" align="right"><input type="text" name="txt_indirizzo" id="txt_indirizzo" onblur="showAddress()"/></td>
				<script type="text/javascript" src="phpUtils/googleUtils.js"></script>
            <td nowrap="nowrap" align="left"><label id="obblig_indirizzo" style="display:none" class="labelmissing"/>*</label></td>
            </tr>

googleUtils.js

// JavaScript Document
//key google map: ABQIAAAAylyUSiWf0T-Vpicn0c1oHxSn6THA6mDGXfWJc9aerBXvDGjVbRRQ8XMQf2xWPSkZYbb0HrXV2c3-KA


var geocoder = new GClientGeocoder();
var indirizzo = document.getElementById("txt_indirizzo"); 
var citta = document.getElementById("txt_citta");
var provincia = document.getElementById("txt_provincia");


function showAddress() {
	var address = indirizzo.value + " " + citta.value + " " + provincia.value;
	var latitude = document.getElementById("hdn_latitude");
	var longitude = document.getElementById("hdn_longitude");
	
      if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              latitude.value = point.lat();
			  longitude.value = point.lng();
            }
          }
        );
      }
}


//<![CDATA[
var map;
var geocoder;

function load() {
  if (GBrowserIsCompatible()) {
	geocoder = new GClientGeocoder();
	map = new GMap2(document.getElementById('map'));
	map.addControl(new GSmallMapControl());
	map.addControl(new GMapTypeControl());
	map.setCenter(new GLatLng(40, -100), 4);
  }
}

function searchLocations() {
 var address = document.getElementById('addressInput').value;
 geocoder.getLatLng(address, function(latlng) {
   if (!latlng) {
	 alert(address + ' not found');
   } else {
	 searchLocationsNear(latlng);
   }
 });
}

function searchLocationsNear(center) {
 var radius = document.getElementById('radiusSelect').value;
 var searchUrl = 'phpUtils/phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
 GDownloadUrl(searchUrl, function(data) {
   var xml = GXml.parse(data);
   var markers = xml.documentElement.getElementsByTagName('marker');
   map.clearOverlays();

   var sidebar = document.getElementById('sidebar');
   sidebar.innerHTML = '';
   if (markers.length == 0) {
	 sidebar.innerHTML = 'Nessun risultato trovato';
	 map.setCenter(new GLatLng(40, -100), 7);
	 return;
   }

   var bounds = new GLatLngBounds();
   for (var i = 0; i < markers.length; i++) {
	 var nome = markers[i].getAttribute('nome');
	 var cognome = markers[i].getAttribute('cognome');
	 var address = markers[i].getAttribute('address');
	 var distance = parseFloat(markers[i].getAttribute('distance'));
	 var point = new GLatLng(parseFloat(markers[i].getAttribute('lat')),
							 parseFloat(markers[i].getAttribute('lng')));
	 
	 var marker = createMarker(point, nome, cognome, address);
	 map.addOverlay(marker);
	 var sidebarEntry = createSidebarEntry(marker, nome, cognome, address, distance);
	 sidebar.appendChild(sidebarEntry);
	 bounds.extend(point);
   }
   map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
 });
}

function createMarker(point, nome, cognome, address) {
  var marker = new GMarker(point);
  var html = '' + nome + ' ' + cognome + ' 
' + address;
  GEvent.addListener(marker, 'click', function() {
	marker.openInfoWindowHtml(html);
  });
  return marker;
}

function createSidebarEntry(marker, nome, cognome, address, distance) {
  var div = document.createElement('div');
  var html = '' + nome + ' ' + cognome +' (' + distance.toFixed(1) + ')
' + address;
  div.innerHTML = html;
  div.style.cursor = 'pointer';
  div.style.marginBottom = '5px'; 
  GEvent.addDomListener(div, 'click', function() {
	GEvent.trigger(marker, 'click');
  });
  GEvent.addDomListener(div, 'mouseover', function() {
	div.style.backgroundColor = '#eee';
  });
  GEvent.addDomListener(div, 'mouseout', function() {
	div.style.backgroundColor = '#fff';
  });
  return div;
}
//]]>

[nico.gaglia]

..dimenticavo...

nella funzione showAddress il citta.value è uguale a "Comune"

[deleted_110]

Questo e' un altro problema che si risolve facilemte.

Basta spostare la riga

var citta = document.getElementById("txt_citta");

dentro la funzione showAddress.

anzi, fai cosi' anche per tutte e tre le altre righe:

var indirizzo = document.getElementById("txt_indirizzo");
var citta = document.getElementById("txt_citta");
var provincia = document.getElementById("txt_provincia");

Ma permettimi una domanda.

Quand'e' che inlcudi quel file js? Perche' secondo me dovrebbe darti degli errori in console

[nico.gaglia]

assurdo.... ho spostato dentro la funzione quelle tre variabili e ora funziona...

il file l'ho messo dentro la cella dell'indirizzo (vedi post precedente)

grazie.....

spero che questa discussione serva da esempio ad altri, dato che la combo provincia città è un'applicazione molto frequente.

grazie

[deleted_110]

Non tanto assurdo. Se ti va ti spiego la mia ipotesi.

Prima tu creavi una variabile javascript chiamata citta che fa riferimento alla select dei comuni.

Poi con AJAX distruggi questa select per sostituirla con quella creata dinamicamente.

Ma la vecchia variabile rimane e continua a puntare ad un oggetto che non e' piu' nella pagina ma rimane in memoria (il garbage collector non l'ha distrutto).

Quindi nella memoria ci sono due select con lo stesso nome e id e il browser non sa piu' che fare.

Ecco perche' e' meglio non usare innerHTML (metodo sicuramente comodo) per preferirgli i metodi del DOM (createElement, createNode etc...)

[deleted_110]

PS

con queste modifiche il file js puoi anche metterlo dentro l'head della pagina. Che poi e' il posto piu' adatto.

[nico.gaglia]

grazie ancora...
si in effetti devo aprire le mie vedute... e usare i metodi del dom....