Passing this.value to an AJAX javascript function which contains white spaces, not returning any results

Question

I have drop down menu that is populated with different US states. When the user selects different states, it sends this.value to an ajax function that populates another drop down menu filled with the different cities within that state.

The good news is that it works... for the most part. however when I select a state with 2 words such as "New York", it doesnt find anything. I recon its because there is a white space in the middle. therefore this.value is actually passing only "New" and not "New York". Below is my PHP code and AJAX function. can anyone tell me what i have missed here?! thanks a million :-)

        //if result returns a value
if ($result != NULL){

    $row = mysql_fetch_assoc($result);
    $countryCode = $row['Code'];

    if ($countryCode != NULL){

        $sql = "SELECT DISTINCT District FROM City WHERE CountryCode = '$countryCode'";
        $result = mysql_query($sql);

        ?>
        <select name="state" onchange="getCity('<?=$country?>',this.value)">
        <option>Select State</option>

        <? while($row=mysql_fetch_array($result)) { ?>

        <option value="<?=$row['District']?>"><?=$row['District']?></option>

        <? } ?>

        </select>

    <?php

    }


}


function getCity(countryId, stateId) {      
    var strURL="findCity.php?country="+countryId+"&state="+stateId;
    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);
    }

You are using [an **obsolete** database API](http://stackoverflow.com/q/12859942/19068) and should use a [modern replacement](http://php.net/manual/en/mysqlinfo.api.choosing.php) — Quentin, Jan 27 '13 at 13:46

score 2 · Accepted Answer · answered Jan 27 '13 at 13:44

2

You should enclose the value in double quotes like this

<option value="<?=$row['District']?>"><?=$row['District']?></option>

The HTML is by default taking first word as a value and the next word as the name of next attribute which doesn't have any value. Enclosing it in quotes will make the whole phrase as single value..

answered Jan 27 '13 at 13:44

Salman

9,299
6
40
73

Its strange, did you log to console what you getting as second argument of `getCity()`? – Salman Jan 27 '13 at 14:02
When I test my application in chrome, it works fine. it finds all cities within New York just fine. But for some reason, in IE9 it is not working. – Frank Castle Jan 27 '13 at 16:25
Your answer worked, but I needed to clear my browser cache. Thank you @Салман – Frank Castle Jan 27 '13 at 16:28

Passing this.value to an AJAX javascript function which contains white spaces, not returning any results

1 Answers1