How are State and Country Picklist values encoded/updated in the rendered page?

Question

We have a bug where the state picklist does not update when the country picklist is changed in one page (with the feature working in other pages). There are no JavaScript errors in the console.

To help me debug this, can anyone outline how this mechanism works so I can track down what is wrong/missing? I can't find the state data in any JavaScript and the country picklist does not have any JavaScript immediately attached to it.

(This isn't a question about how to configure the feature: the feature is configured and working in most pages.)

Answer 1

Just found the data for a working case. The data is inserted inline in the page with it looks like the new picklist calls wiring the data up to the fields:

<script type="text/javascript">//<![CDATA[
window.pl = window.pl || {};
pl.map_63_012d0000000sh5I={'CA':'JAACAMDk0AEA','US':'2//9/z8bL/4A'};
pl.vals_63_012d0000000sh5I=['AK','AK','AL','AL','AB','Alberta','AZ','Arizona','AR','Arkansas','BC','British Columbia','CA','California','CO','Colorado','CT','Connecticut','DE','Delaware','DC','District of Columbia','FL','Florida','GA','Georgia','HI','Hawaii','ID','Idaho','IL','Illinois','IN','Indiana','IA','Iowa','KS','Kansas','KY','Kentucky','LA','Louisiana','ME','Maine','MB','Manitoba','MD','Maryland','MA','Massachusetts','MI','Michigan','MN','Minnesota','MS','Mississippi','MO','Missouri','MT','Montana','NE','Nebraska','NV','Nevada','NB','New Brunswick','NL','Newfoundland and Labrador','NH','New Hampshire','NJ','New Jersey','NM','New Mexico','NY','New York','NC','North Carolina','ND','North Dakota','NT','Northwest Territories','NS','Nova Scotia','NU','Nunavut','OH','Ohio','OK','Oklahoma','ON','Ontario','OR','Oregon','PA','Pennsylvania','PE','Prince Edward Island','QC','Quebec','RI','Rhode Island','SK','Saskatchewan','SC','South Carolina','SD','South Dakota','TN','Tennessee','TX','Texas','UT','Utah','VT','Vermont','VA','Virginia','WA','Washington','WV','West Virginia','WI','Wisconsin','WY','Wyoming','YT','Yukon Territories'];
pl.noneLabel="--None--";
pl.naLabel="\*\*Not Applicable\*\*";
pl.selectedLabel="Chosen";
pl.availableLabel="Available";
new picklist('policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___MailingStateCode','63_012d0000000sh5I','policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___MailingCountryCode',['',''],' id=\"policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___MailingStateCode\" name=\"policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___MailingStateCode\"',true,true);
new picklist('policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___OtherStateCode','63_012d0000000sh5I','policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___OtherCountryCode',['',''],' id=\"policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___OtherStateCode\" name=\"policyholder:f:ppb:c:pb:cpbs:Contact-1:Section-1:Contact___OtherStateCode\"',true,true);
picklist.initialized = false;
picklist.initAll();
//]]>
...
</script>

Now just have to figure out why that JavaScript doesn't get emitted in the failing page...

PS

The problem turned out to be that one page was set to API 18.0 (the one that didn't work) and the other page was set to API 20.0 (the one that did work). Changing to API 20.0 fixed the problem.