update country sync example to use new countryData arg

jackocnr · Mar 1, 2016 · 4e3a0ff · 4e3a0ff
1 parent b9e2028
commit 4e3a0ff
Show file tree

Hide file tree

Showing 8 changed files with 42 additions and 46 deletions.
diff --git a/examples/gen/country-sync.html b/examples/gen/country-sync.html
@@ -4,10 +4,10 @@
     <meta charset="utf-8">
     <title>Example: Country sync</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
-      <link rel="stylesheet" href="../css/countrySync.css?1455225389933">
+      <link rel="stylesheet" href="../css/countrySync.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -59,20 +59,18 @@ <h2>Code</h2>
 $.each(countryData, function(i, country) {
   addressDropdown.append($(&quot;&lt;option&gt;&lt;/option&gt;&quot;).attr(&quot;value&quot;, country.iso2).text(country.name));
 });
+// set it&#39;s initial value
+var initialCountry = telInput.intlTelInput(&quot;getSelectedCountryData&quot;).iso2;
+addressDropdown.val(initialCountry);
 
 // listen to the telephone input for changes
-telInput.on(&quot;countrychange&quot;, function() {
-  var countryCode = telInput.intlTelInput(&quot;getSelectedCountryData&quot;).iso2;
-  addressDropdown.val(countryCode);
+telInput.on(&quot;countrychange&quot;, function(e, countryData) {
+  addressDropdown.val(countryData.iso2);
 });
 
-// trigger a fake &quot;change&quot; event now, to trigger an initial sync
-telInput.trigger(&quot;countrychange&quot;);
-
 // listen to the address dropdown for changes
 addressDropdown.change(function() {
-  var countryCode = $(this).val();
-  telInput.intlTelInput(&quot;setCountry&quot;, countryCode);
+  telInput.intlTelInput(&quot;setCountry&quot;, $(this).val());
 });
 </code></pre>
 
@@ -95,7 +93,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/countrySync.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/countrySync.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/default-country-ip.html b/examples/gen/default-country-ip.html
@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <title>Example: Lookup user&#39;s country</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -49,7 +49,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/defaultCountryIp.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/defaultCountryIp.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/hidden-input.html b/examples/gen/hidden-input.html
@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <title>Example: Submitting the full international number when in nationalMode</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -55,7 +55,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/hiddenInput.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/hiddenInput.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/is-valid-number.html b/examples/gen/is-valid-number.html
@@ -4,10 +4,10 @@
     <meta charset="utf-8">
     <title>Example: Validation</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
-      <link rel="stylesheet" href="../css/isValidNumber.css?1455225389933">
+      <link rel="stylesheet" href="../css/isValidNumber.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -75,7 +75,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/isValidNumber.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/isValidNumber.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/modify-country-data.html b/examples/gen/modify-country-data.html
@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <title>Example: Modify country data</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -47,7 +47,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/modifyCountryData.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/modifyCountryData.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/national-mode.html b/examples/gen/national-mode.html
@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <title>Example: National Mode</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -58,7 +58,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/nationalMode.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/nationalMode.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/gen/only-countries-europe.html b/examples/gen/only-countries-europe.html
@@ -4,8 +4,8 @@
     <meta charset="utf-8">
     <title>Example: European countries</title>
     <link rel="stylesheet" href="../css/prism.css">
-    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1455225389933">
-    <link rel="stylesheet" href="../../build/css/demo.css?1455225389933">
+    <link rel="stylesheet" href="../../build/css/intlTelInput.css?1456859475147">
+    <link rel="stylesheet" href="../../build/css/demo.css?1456859475147">
 
 
     <!-- GOOGLE ANALYTICS -->
@@ -46,7 +46,7 @@ <h2>Result</h2>
 
     <script src="../js/prism.js"></script>
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
-    <script src="../../build/js/intlTelInput.js?1455225389933"></script>
-    <script src="../js/onlyCountriesEurope.js?1455225389933"></script>
+    <script src="../../build/js/intlTelInput.js?1456859475147"></script>
+    <script src="../js/onlyCountriesEurope.js?1456859475147"></script>
   </body>
 </html>
diff --git a/examples/js/countrySync.js b/examples/js/countrySync.js
@@ -12,18 +12,16 @@ telInput.intlTelInput({
 $.each(countryData, function(i, country) {
   addressDropdown.append($("<option></option>").attr("value", country.iso2).text(country.name));
 });
+// set it's initial value
+var initialCountry = telInput.intlTelInput("getSelectedCountryData").iso2;
+addressDropdown.val(initialCountry);
 
 // listen to the telephone input for changes
-telInput.on("countrychange", function() {
-  var countryCode = telInput.intlTelInput("getSelectedCountryData").iso2;
-  addressDropdown.val(countryCode);
+telInput.on("countrychange", function(e, countryData) {
+  addressDropdown.val(countryData.iso2);
 });
 
-// trigger a fake "change" event now, to trigger an initial sync
-telInput.trigger("countrychange");
-
 // listen to the address dropdown for changes
 addressDropdown.change(function() {
-  var countryCode = $(this).val();
-  telInput.intlTelInput("setCountry", countryCode);
+  telInput.intlTelInput("setCountry", $(this).val());
 });