javascript, .split(), implement additional variable

Question

I found a code for city,state dropdown menu. It works flawlessly, but I am implementing additional feature by adding a US State to the following code:

//countries array
var countries = Object();
countries['Africa'] = '|Algeria|Angola|Benin';

//state array
var city_states = Object();
city_states['United States'] = '|Washington DC||Alabama|Alaska';

this is an array for US Cities, but I want to add a State abbreviation like so: DC, AL, AK and so on to be sent to the menu such as this:

function setRegions()

    {
        for (region in countries)
            document.write('<option value="' + region + '">' + region + '</option>');
    }

function set_country(oRegionSel, oCountrySel, oCity_StateSel)
{
    var countryArr;
    oCountrySel.length = 0;
    oCity_StateSel.length = 0;
    var region = oRegionSel.options[oRegionSel.selectedIndex].text;
    if (countries[region])
    {
        oCountrySel.disabled = false;
        oCity_StateSel.disabled = true;
        oCountrySel.options[0] = new Option('SELECT COUNTRY','');
        countryArr = countries[region].split('|');
        for (var i = 0; i < countryArr.length; i++)
            oCountrySel.options[i + 1] = new Option(countryArr[i], countryArr[i]);
        document.getElementById('txtregion').innerHTML = region;
        document.getElementById('txtplacename').innerHTML = '';
    }
    else oCountrySel.disabled = true;
}

function set_city_state(oCountrySel, oCity_StateSel)
{
    var city_stateArr;
    oCity_StateSel.length = 0;
    var country = oCountrySel.options[oCountrySel.selectedIndex].text;
    if (city_states[country])
    {
        oCity_StateSel.disabled = false;
        oCity_StateSel.options[0] = new Option('SELECT NEAREST DIVISION','');
        city_stateArr = city_states[country].split('|');
        for (var i = 0; i < city_stateArr.length; i++)
            oCity_StateSel.options[i+1] = new Option(city_stateArr[i],city_stateArr[i]);
        document.getElementById('txtplacename').innerHTML = country;
    }
    else oCity_StateSel.disabled = true;
}

function print_city_state(oCountrySel, oCity_StateSel)
{
    var country = oCountrySel.options[oCountrySel.selectedIndex].text;
    var city_state = oCity_StateSel.options[oCity_StateSel.selectedIndex].text;
    if (city_state && city_states[country].indexOf(city_state) != -1)
        document.getElementById('txtplacename').innerHTML = city_state + ', ' + country;
    else document.getElementById('txtplacename').innerHTML = country;
}

I was thinking adding an additional array of State abbreviations, but I think adding a simple state abbreviation to the already built array would do just fine by adding another value in the setregions() and having + abbreviation + instead of + region +. Any ideas how to implement it? -thank you.

Ozzy · Accepted Answer · 2011-12-16 22:21:34Z

1

If you have an array of States (objects) rather than an array of Strings you could do something like this:

function State(longName, shortName) {
    this.longName = longName;
    this.shortName = shortName;
}

I don't know what the abbreviations are, but store them like this in your array
var cityStates = "State:Abbrev|Washington DC:WDC|ETC:etc"

var stateNames = cityStates.split("|");

var states = new Array(stateNames.length);

for (i=0; i<states.length; i++)
    var longName = stateNames[i].split(":")[0];
    var shortName = stateNames[i].split(":")[1];
    states[i] = new State(longName,shortName);
}

That would give you a new array "states" with 50 state objects, each which could be called like this:

states[0] //(returns a State object at index 0)
states[0].longName //(returns the long name)
states[0].shortName //(returns the abbreviated name)

answered Dec 16, 2011 at 22:21

Ozzy

8,3327 gold badges58 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

prkarpi Over a year ago

javascript still have to write this in the: function setRegions() { for (region in countries) document.write('<option value="' + region + '">' + region + '</option>'); } how would it be done without assigning a variable to it?

Ozzy Over a year ago

Sorry I don't understand what you mean?

prkarpi Over a year ago

I have setRegions() which writes the HTML, but it still has both variables + region + in both fields and will not write State abbreviation and State separately. I need <option value="+ stateAbbr +">' + region + '</option>.

Ozzy Over a year ago

so if you implement what I gave you, you would need to create a separate loop for the States, and write them like this: for (i=0;i<states.length;i++) { document.write("<option value='"+states[i].shortName+"'>"+states[i].longName+"</option>\n"); }

Collectives™ on Stack Overflow

javascript, .split(), implement additional variable

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related