dimanche 28 juin 2015

Incorporating form data with XML data

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+"&nbsp"+lname+"</option>");
        });

Aucun commentaire:

Enregistrer un commentaire