Adding a State/Province Select Element to Your Meteor Apps

Meteors Are Not Needed Less Than Mountains

Oftentimes we see Select elements on web sites/apps containing as options all the States in the U.S. Of course, depending on where you live and/or your target audience, you may want to populate the Select element with different values, but for those serving the U.S. market, the snippets that follow can be used completely "as-is" in a Meteor app, with the sole exception that you will need to replace the Template name ("addJobLoc" in the snippets below) with the name of your own Template.

As an added bonus (and free, to boot!), I'm adding Canadian Provinces and Territories, too. After all, how can we forget, neglect, or "dis" our neighbors to the North, who gave us Neil Young, Gordon Lightfoot, the Guess Who, Rush, Bryan Adams, Anne Murray, most of the cats from The Band, J. Kenneth Galbraith, Ferguson Jenkins, Steve Nash, "Strange Brew", maple syrup, etc.

First, add this HTML and SpaceBars code in your Template's .html file:

<select id="stateorprovince" name="stateorprovince">
    {{#each statesAndProvinces}}
      <option title="{{hint}}">{{abbrcode}}</option>
    {{/each}}
</select>

Note that I am using the full place name as the "hover hint" for the item, and the two-letter designation as the content (select options).

Now put this code in the corresponding *.js file for the Template:

Template.addJobLoc.helpers({
  statesAndProvinces: function() {
    return [{
      "hint": "Alabama",
      "abbrcode": "AL"
    }, {
      "hint": "Alaska",
      "abbrcode": "AK"
    }, {
      "hint": "American Samoa",
      "abbrcode": "AS"
    }, {
      "hint": "Arizona",
      "abbrcode": "AZ"
    }, {
      "hint": "Arkansas",
      "abbrcode": "AR"
    }, {
      "hint": "British Columbia",
      "abbrcode": "BC"
    }, {
      "hint": "California",
      "abbrcode": "CA"
    }, {
      "hint": "Colorado",
      "abbrcode": "CO"
    }, {
      "hint": "Connecticut",
      "abbrcode": "CT"
    }, {
      "hint": "Delaware",
      "abbrcode": "DE"
    }, {
      "hint": "District Of Columbia",
      "abbrcode": "DC"
    }, {
      "hint": "Federated States Of Micronesia",
      "abbrcode": "FM"
    }, {
      "hint": "Florida",
      "abbrcode": "FL"
    }, {
      "hint": "Georgia",
      "abbrcode": "GA"
    }, {
      "hint": "Guam",
      "abbrcode": "GU"
    }, {
      "hint": "Hawaii",
      "abbrcode": "HI"
    }, {
      "hint": "Idaho",
      "abbrcode": "ID"
    }, {
      "hint": "Illinois",
      "abbrcode": "IL"
    }, {
      "hint": "Indiana",
      "abbrcode": "IN"
    }, {
      "hint": "Iowa",
      "abbrcode": "IA"
    }, {
      "hint": "Kansas",
      "abbrcode": "KS"
    }, {
      "hint": "Kentucky",
      "abbrcode": "KY"
    }, {
      "hint": "Louisiana",
      "abbrcode": "LA"
    }, {
      "hint": "Maine",
      "abbrcode": "ME"
    }, {
      "hint": "Manitoba",
      "abbrcode": "MB"
    }, {
      "hint": "Marshall Islands",
      "abbrcode": "MH"
    }, {
      "hint": "Maryland",
      "abbrcode": "MD"
    }, {
      "hint": "Massachusetts",
      "abbrcode": "MA"
    }, {
      "hint": "Michigan",
      "abbrcode": "MI"
    }, {
      "hint": "Minnesota",
      "abbrcode": "MN"
    }, {
      "hint": "Mississippi",
      "abbrcode": "MS"
    }, {
      "hint": "Missouri",
      "abbrcode": "MO"
    }, {
      "hint": "Montana",
      "abbrcode": "MT"
    }, {
      "hint": "Nebraska",
      "abbrcode": "NE"
    }, {
      "hint": "Nevada",
      "abbrcode": "NV"
    }, {
      "hint": "New Brunswick",
      "abbrcode": "NB"
    }, {
      "hint": "New Hampshire",
      "abbrcode": "NH"
    }, {
      "hint": "New Jersey",
      "abbrcode": "NJ"
    }, {
      "hint": "New Mexico",
      "abbrcode": "NM"
    }, {
      "hint": "New York",
      "abbrcode": "NY"
    }, {
      "hint": "Newfoundland and Labrador",
      "abbrcode": "NL"
    }, {
      "hint": "North Carolina",
      "abbrcode": "NC"
    }, {
      "hint": "North Dakota",
      "abbrcode": "ND"
    }, {
      "hint": "Northern Mariana Islands",
      "abbrcode": "MP"
    }, {
      "hint": "Nova Scotia",
      "abbrcode": "NS"
    }, {
      "hint": "Northwest Territories",
      "abbrcode": "NT"
    }, {
      "hint": "Nunavut",
      "abbrcode": "NU"
    }, {
      "hint": "Ohio",
      "abbrcode": "OH"
    }, {
      "hint": "Oklahoma",
      "abbrcode": "OK"
    }, {
      "hint": "Ontario",
      "abbrcode": "ON"
    }, {
      "hint": "Oregon",
      "abbrcode": "OR"
    }, {
      "hint": "Palau",
      "abbrcode": "PW"
    }, {
      "hint": "Pennsylvania",
      "abbrcode": "PA"
    }, {
      "hint": "Prince Edward Island",
      "abbrcode": "PE"
    }, {
      "hint": "Puerto Rico",
      "abbrcode": "PR"
    }, {
      "hint": "Quebec",
      "abbrcode": "QC"
    }, {
      "hint": "Rhode Island",
      "abbrcode": "RI"
    }, {
      "hint": "Saskatchewan",
      "abbrcode": "SK"
    }, {
      "hint": "South Carolina",
      "abbrcode": "SC"
    }, {
      "hint": "South Dakota",
      "abbrcode": "SD"
    }, {
      "hint": "Tennessee",
      "abbrcode": "TN"
    }, {
      "hint": "Texas",
      "abbrcode": "TX"
    }, {
      "hint": "Utah",
      "abbrcode": "UT"
    }, {
      "hint": "Vermont",
      "abbrcode": "VT"
    }, {
      "hint": "Virgin Islands",
      "abbrcode": "VI"
    }, {
      "hint": "Virginia",
      "abbrcode": "VA"
    }, {
      "hint": "Washington",
      "abbrcode": "WA"
    }, {
      "hint": "West Virginia",
      "abbrcode": "WV"
    }, {
      "hint": "Wisconsin",
      "abbrcode": "WI"
    }, {
      "hint": "Wyoming",
      "abbrcode": "WY"
    }, {
      "hint": "Yukon",
      "abbrcode": "YT"
    }]
  }
});

Note that I got the JSON list of states and provinces from wholypantalones (great moniker, primo!) here.

Shine, Waxing Platform (Framework?)!

In over twenty years of programming, I have for the most part tolerated (sometimes just barely) the particular technology I was working with (some of which (they shall remain nameless, but rhyme with "Hacktuate," "Mistr[i]al Reports" and "Windoze Bomb-packed Framework") were so painful to work with that I seriously considered changing professions).

On two occasions, though, I have been"head over heels" in love with a particular technology: The first time was with Delphi (Object Pascal) which, IMO, surpassed its peers in all ways except for market share and business acumen of some of those tasked with positioning that great language and conglomeration of tools. The second time (now) is with Meteor, a node.js-based, Isomorphic JavaScript extravaganza.

Meteor is a waxing (as opposed to waning - nothing to do with waxing of surfboards or skin) platform (or framework, depending on your POV) and, if you haven't yet, you owe it to yourself to, in the words of the inimitable and irrepressible Hoosier John Mellencamp, check it out.