Currently, I am in the process of transitioning my jQuery calls to AngularJS. Previously, I created a web page for zip code lookup using the ziplookup library, accessible through this link.
To implement this, I had to include the following script:
<script src="http://ziplookup.googlecode.com/git/public/ziplookup/zipLookup.min.js" type="text/javascript">
</script>
as well as the following jQuery code:
$(document).ready(function() { // When the document loads,
$.zipLookupSettings.libDirPath = 'ziplookup/' // (Optionally) set the library folder path manually
$('[name=zipcode]').blur(function(){ // Set on blur
$.zipLookup( // Do a Zip code Lookup
$(this).val(), // Zip code Field Value
function(cityName, stateName, stateShortName){ // If Successful,
$('input[name=city]').val(cityName); // Set City name
$('input[name=state_short]').val(stateName); // Set State abbreviation
$('input[name=state]').val(stateShortName); // Set State name
$('.message').html("Found Zipcode"); // Add a message
},
function(errMsg){ // If Zip couldn't be found,
$('.message').html("Error: " + errMsg); // Add an error message
});
});
});
Now, I am attempting to migrate this functionality to AngularJS. Instead of triggering the zipLookup function on blur event, I am now calling it upon button press with the same parameters. However, I am encountering errors such as ReferenceError: zipLookupSettings is not defined or ReferenceError: zipLookup is not defined.
$scope.zipeval = function(){
//zipLookupSettings.libDirPath = 'ziplookup/';
zipLookup( // Do a Zip code Lookup
11722, // Zip code Field Value
function(cityName, stateName, stateShortName){ // If Successful,
$log.log(cityName + stateName + stateShortName);
//$('input[name=city]').val(cityName); // Set City name
//$('input[name=state_short]').val(stateName); // Set State abbreviation
//$('input[name=state]').val(stateShortName); // Set State name
//$('.message').html("Found Zipcode"); // Add a message
},
function(errMsg){ // If Zip couldn't be found,
$log.log("error"); // Add an error message
});
};
I am seeking guidance on whether I need to create a directive for this situation.