- Created by Perry Tew, last modified on May 16, 2011
You are viewing an old version of this page. View the current version.
Compare with Current View Page History
« Previous Version 10 Next »
Method Definition
Method Signature |
|
Description |
Takes a zip and does a city and state lookup with the United States Postal Service. |
Result |
A CityStateZip object. |
Discussion
- Make the remote call
- Check to make sure the result is not null. If it is, a system error occurred.
- Check CityStateZip.validZip flag. If false, the zip was invalid.
- If zip was valid, city and state will be populated and may be used.
Examples
The following file is also an attachment to this page.
Checkout API v1.1 Expand source
<html> <head> <script type='text/javascript' src='js/jquery-1.4.2.min.js'></script> <script type='text/javascript' src='js/jquery.json-2.2.min.js'></script> <script type='text/javascript' src='js/checkoutapi-1.1.js'></script> <script type='text/javascript'> window.onload = function(){ log('initializing checkout'); initializeCheckoutAPI("DEMO", 'secure.ultracart.com', 'http://www.mystore.com/proxy.php'); log('getting cart instance'); getCartInstance(); log('attaching lookup function to zip element blur event'); document.getElementById('zip').addEventListener('blur', lookup); }; function lookup(){ var zip = document.getElementById('zip'); var city = document.getElementById('city'); var state = document.getElementById('state'); log('lookup(' + zip.value + '):'); //Method 1: Asynchronously getCityState(zip.value, {async:true, onComplete:function(result){ if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } }}); //Method 2: Synchronous /* var result = getCityState(zip.value); if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } */ } function log(msg){ var div = document.getElementById('log'); var txtNode = document.createTextNode(msg); var br = document.createElement('br'); div.appendChild(txtNode); div.appendChild(br); } </script> </head> <body> <table> <tr><td>Zip Code:</td><td><input type='text' id='zip'/></td></tr> <tr><td>City:</td><td><input type='text' id='city'/></td></tr> <tr><td>State:</td><td><input type='text' id='state' /></td></tr> </table> <div id='log' style='margin-top:20px;'> <div style='font-weight:bold'>Log Events Will Appear Below:</div> </div> </body> </html>
The following file is also an attachment to this page.
Checkout API v1.2 Expand source
<html> <head> <script type='text/javascript' src='js/jquery-1.4.2.min.js'></script> <script type='text/javascript' src='js/jquery.json-2.2.min.js'></script> <script type='text/javascript' src='js/checkoutapi-1.2.js'></script> <script type='text/javascript'> window.onload = function(){ log('initializing checkout'); initializeCheckoutAPI({merchantId: "DEMO", secureHostName:'secure.ultracart.com', callbackUrl:'http://www.mystore.com/proxy.php', debugMode:true, verboseAjax:true}); log('getting cart instance'); getCartInstance(); log('attaching lookup function to zip element blur event'); document.getElementById('zip').addEventListener('blur', lookup); }; function lookup(){ var zip = document.getElementById('zip'); var city = document.getElementById('city'); var state = document.getElementById('state'); log('lookup(' + zip.value + '):'); //Method 1: Asynchronously getCityState(zip.value, {async:true, onComplete:function(result){ if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } }}); //Method 2: Synchronous /* var result = getCityState(zip.value); if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } */ } function log(msg){ var div = document.getElementById('log'); var txtNode = document.createTextNode(msg); var br = document.createElement('br'); div.appendChild(txtNode); div.appendChild(br); } </script> </head> <body> <table> <tr><td>Zip Code:</td><td><input type='text' id='zip'/></td></tr> <tr><td>City:</td><td><input type='text' id='city'/></td></tr> <tr><td>State:</td><td><input type='text' id='state' /></td></tr> </table> <div id='log' style='margin-top:20px;'> <div style='font-weight:bold'>Log Events Will Appear Below (debugMode is also ON, so open your browser's console for additional info):</div> </div> </body> </html>
The following file is also an attachment to this page.
Checkout API v2.0 Expand source
<html> <head> <script type='text/javascript' src='js/jquery-1.4.2.min.js'></script> <script type='text/javascript' src='js/jquery.json-2.2.min.js'></script> <script type='text/javascript' src='js/checkoutapi-2.0.js'></script> <script type='text/javascript'> var merchantCartConfig = { merchantId: "DEMO", screenBrandingThemeCode: 'DFLT', // doesn't affect these pages, but will determine how receipt and upsell pages appear. isCheckoutPage: false, // if true, additional code is run during init() to populate shipping methods and such. This must // be true if you are collecting address information, displaying shipping, or finalizing an order. checkoutSite: 'secure.ultracart.com', // this site is only used during checkout. You may omit this, and checkout will proceed to secure.ultracart.com // if you provide a value, it must be an SSL alias that points to secure.ultracart.com (Custom SSL Certificate) // if isCheckoutPage = false, this value doesn't matter. remoteApiUrl: 'http://www.mystore.com/proxy.php', // this url is used for all remote calls. It may point to secure.ultracart.com, a custom SSL site, or your own proxy script. // you may omit this, and the default url is used (points to a path at secure.ultracart.com) // see the top of the checkoutapi script for the path info if you have a custom ssl cert. debugMode: true, verboseAjax: true }; jQuery('document').ready(function(){ log('initializing checkout'); ultraCart.init(merchantCartConfig); log('attaching lookup function to zip element blur event'); document.getElementById('zip').addEventListener('blur', lookup); }); function lookup(){ var zip = document.getElementById('zip'); var city = document.getElementById('city'); var state = document.getElementById('state'); log('lookup(' + zip.value + '):'); //Method 1: Asynchronously ultraCart.getCityState(zip.value, {async:true, onComplete:function(result){ if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } }}); //Method 2: Synchronous /* var result = ultraCart.getCityState(zip.value); if(result == null){ log('result of remote call was null. something went wrong on the server.'); } else if(result.validZip){ log(' SUCCESS! ' + result.city + ' ' + result.state); city.value = result.city; state.value = result.state; } else { log(' Invalid Zip Code'); if(result.error){ log(' System Error: ' + result.error); // handle this gracefully or just ignore... } } */ } function log(msg){ var div = document.getElementById('log'); var txtNode = document.createTextNode(msg); var br = document.createElement('br'); div.appendChild(txtNode); div.appendChild(br); } </script> </head> <body> <table> <tr><td>Zip Code:</td><td><input type='text' id='zip'/></td></tr> <tr><td>City:</td><td><input type='text' id='city'/></td></tr> <tr><td>State:</td><td><input type='text' id='state' /></td></tr> </table> <div id='log' style='margin-top:20px;'> <div style='font-weight:bold'>Log Events Will Appear Below (debugMode is also ON, so open your browser's console for additional info):</div> </div> </body> </html>
- No labels