Select an Option based on req.responseText

Question

I don't know if I am just thinking too hard about this or what. I just want to be able to select a specific option based on the result I get from a call. Currently call produces City, State, Country based on Zip code. The response from the GET is "Sacramento | CA | United States" I can easily put the responses into input boxes, but I can't figure out how to select an option based on the response. Is this possible? I've been looking through some of the method properties and i'm not really seeing anything that I can use.

Here is the Get script.

<script type="text/javascript">
var req; 
var oldData; 
var doesNotSupport = true; 

function getAddress(url, number) 
{ 
if (number == "" || oldData == number || !doesNotSupport) 
    return; 

oldData = number; 
document.getElementById('city').value = "Searching ...";
document.getElementById('state').value = "Searching ...";
document.getElementById('country').value = "Searching ...";

if (window.XMLHttpRequest) { 
    req = new XMLHttpRequest; 
} else if (window.ActiveXObject) { 
    req = new ActiveXObject("Microsoft.XMLHTTP"); 
} 

if (req) { 
   req.onreadystatechange = processReqChange; 
   req.open("GET", url + '?number=' + number + '&zip=' + number, true);
   req.send(null); 
   } else { 
   alert("Your browser does not support XMLHttpRequest technology!"); 
   doesNotSupport = false; 
  } 
}
</script>

Here is the Response script

<script type="text/javascript">
function processReqChange() { 
// only if req shows "loaded" 
if (req.readyState == 4) { 
// only if "OK" 
if (req.status == 200) { 
    var Result = req.responseText.split("|");
document.getElementById('city').value = Result[0];
document.getElementById('state').value = Result[1];
         This is the problem child.
   document.getElementById('country').value = Result[2];
} else { 
    alert("There was a problem retrieving the XML data:\n" + req.statusText); 
    } 
  } 
}
</script>

option setup
<option name="(abbr.)" value="(full name)">Full Name</option>
i.e.
<option name="CA" value="California">California</option>

I'm just looking for something to replace the .value property. Something like document.getElementById('state').childNode.attribute.name = Result[1] or something.
Here is a link to the full page file http://ge.tt/99dJ1J9?c

Answer 1

The problem is that you do not have the abbrev for the state in option value and the response contains the abbrev.

Also, i would recommend you some javascript framework. It would help you very much with common taks like Ajax, form validation and so on.

Just google javascript framework and find one that would fit your needs best :-)

Answer 2

Use this to set the value in your SELECT object (below code is for city):

var selObject = document.getElementById('city_select_id');     
selObject.value = document.getElementById('city').value; //value received in the response