2014-03-23 04:10:12 +00:00
|
|
|
<!doctype html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
2014-03-25 03:08:39 +00:00
|
|
|
<title>country-region-dropdowns example</title>
|
2014-03-23 04:10:12 +00:00
|
|
|
</head>
|
2014-03-24 04:32:44 +00:00
|
|
|
<body>
|
2014-03-23 04:10:12 +00:00
|
|
|
|
2014-03-25 03:53:49 +00:00
|
|
|
<h1>country-region-dropdowns example</h1>
|
|
|
|
|
|
|
|
|
|
<h2>Example 1</h2>
|
2014-03-23 04:10:12 +00:00
|
|
|
|
2014-03-24 04:32:44 +00:00
|
|
|
<p>
|
|
|
|
|
This is a simple no-frills example.
|
|
|
|
|
</p>
|
2014-03-23 04:10:12 +00:00
|
|
|
|
2014-03-24 04:32:44 +00:00
|
|
|
<select class="crs-country" data-region-id="one"></select>
|
2014-03-25 03:08:39 +00:00
|
|
|
<select id="one"></select>
|
2014-03-23 04:10:12 +00:00
|
|
|
|
2014-03-24 04:32:44 +00:00
|
|
|
<hr size="1" />
|
|
|
|
|
|
2014-03-25 03:08:39 +00:00
|
|
|
|
2014-03-25 03:53:49 +00:00
|
|
|
<h2>Example 2</h2>
|
2014-03-24 04:32:44 +00:00
|
|
|
|
2014-03-25 03:08:39 +00:00
|
|
|
<p>
|
|
|
|
|
Custom default option texts for both the country and region dropdowns.
|
2014-03-24 04:32:44 +00:00
|
|
|
</p>
|
|
|
|
|
|
2014-03-25 03:08:39 +00:00
|
|
|
<select class="crs-country" data-region-id="two" data-default-option="Select a country, man."></select>
|
|
|
|
|
<select id="two" data-blank-option="No country selected, mon. (blank value)" data-default-option="Select a region, pal. (default option)"></select>
|
2014-03-24 04:32:44 +00:00
|
|
|
|
2014-03-25 03:08:39 +00:00
|
|
|
<hr size="1" />
|
|
|
|
|
|
|
|
|
|
|
2014-03-25 03:53:49 +00:00
|
|
|
<h2>Example 3</h2>
|
2014-03-25 03:08:39 +00:00
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
The country dropdown values are by default the same as the display values: the full country names.
|
|
|
|
|
By adding the <b>data-value="2-char"</b> attribute to the country field, the values will be a 2-char
|
|
|
|
|
character code.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<select class="crs-country" data-region-id="three" data-value="2-char"></select>
|
2014-03-25 03:53:49 +00:00
|
|
|
<select id="three"></select>
|
2014-03-25 03:08:39 +00:00
|
|
|
|
|
|
|
|
<hr size="1" />
|
2014-03-24 04:32:44 +00:00
|
|
|
|
2014-03-25 03:53:49 +00:00
|
|
|
<h2>Example 4</h2>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
Pre-filling the fields on page load.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<select class="crs-country" data-region-id="four" data-default-value="Canada"></select>
|
|
|
|
|
<select id="four" data-default-value="British Columbia"></select>
|
|
|
|
|
|
|
|
|
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
|
|
|
|
|
<script src="source/jquery.crs.js"></script>
|
2014-03-24 04:32:44 +00:00
|
|
|
</body>
|
2014-03-23 04:10:12 +00:00
|
|
|
</html>
|
