Aleroth 0 Newbie Poster

Hi there,

I have a Country/City list in my SQL database and access it with PHP using a select element in php. I use the Chosen Jquery Plugin for the styling of these select elements.

Now my problem is that i want only the cities of the country selected to display, and i got that right, but then when it loads the city list, it discards the Chosen Style to the select element.

To load my City Select data i use the onChange event. here is the code:

function getXMLHTTP() { //fuction to return the xml http object
 var xmlhttp=false; 
 try{
   xmlhttp=new XMLHttpRequest();
 }
 catch(e) { 
 try{ 
    xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
 }
 catch(e){
 try{
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
 }
 catch(e1){
     xmlhttp=false;
 }
 }
 }
 return xmlhttp;
 }
 function getCity(strURL) { 
 var req = getXMLHTTP();
 if (req) {
   req.onreadystatechange = function() {
 if (req.readyState == 4) {
 // only if "OK"
 if (req.status == 200) { 
      document.getElementById('citydiv').innerHTML=req.responseText; 
 } else {
 alert("There was a problem while using XMLHTTP:\n" + req.statusText);
 }
 } 
 } 
   req.open("GET", strURL, true);
   req.send(null);
 }
 }

that is the Javascript i use to load the file combined with this:

<select name="country" id="country" data-placeholder="Choose a Country..." class="chzn-select-deselect" onChange="getCity('findcity.php?country='+this.value)">

So when the findcity.php is loaded with the new select element
it loses the class that was originally added.
How can i prevent this?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.