I have an xml document with all of the US senators, with their names, emails, addresses, etc. I have managed to pull data from the xml document into a dropdown menu. I would like to make it so by choosing a state, another dropdown menu is displayed showing all the senators just from THAT State. In my HTML code, I have a drop down menu with a list of all fifty states. I would use I believe this would be done using an if statement, but I am unsure how to set the value from a form to that of the xml data that I am using.
Help would be much appreciated!
Here is an example of the XML:
<?xml version="1.0" encoding="UTF-8"?><contact_information><member>
<member_full>Alexander (R-TN)</member_full>
<last_name>Alexander</last_name>
<first_name>Lamar</first_name>
<party>R</party>
<state>TN</state>
<address>455 Dirksen Senate Office Building Washington DC 20510</address>
<phone>(202) 224-4944</phone>
<email>http://ift.tt/1Ho2pLy;
<website>http://ift.tt/1GTIT87;
<class>Class II</class>
<bioguide_id>A000360</bioguide_id>
</member><member>
<member_full>Ayotte (R-NH)</member_full>
<last_name>Ayotte</last_name>
<first_name>Kelly</first_name>
<party>R</party>
<state>NH</state>
<address>144 Russell Senate Office Building Washington DC 20510</address>
<phone>(202) 224-3324</phone>
<email>http://ift.tt/1Ho2pLA;
<website>http://ift.tt/1GTIT89;
<class>Class III</class>
<bioguide_id>A000368</bioguide_id>
Here is my javascript so far:
$(document).ready(function(){
$.ajax({
type: "GET",
url: "senators_cfm.xml",
dataType: "xml",
success: function(xml) {
var select2 = $('#StateSelect');
select2.append('<option value="Select a state">Select a State</option>');
$(xml).find('member').each(function(){
var states = $(this).find('state').text();
select2.append("<option>"+states+"</option>");
});
var select1 = $('#SenatorSelect');
select1.append('<option value="Select a senator">Select a Senator</option>');
$(xml).find('member').each(function(){
var fname = $(this).find('first_name').text();
var lname = $(this).find('last_name').text();
select1.append("<option>"+fname+" "+lname+"</option>");
});
Aucun commentaire:
Enregistrer un commentaire