I am facing this strange problem; I am using Smarty Streets to verify addresses. According to the documentation when you map fields with Smarty Streets API it automatically binds a verified tick mark with the zip field.
As you can see I am mapping 5 sets of fields in my code:
var liveaddress = $.LiveAddress({
key: htmlKey, // An HTML key from your account
debug: true, // Show debug stuff
waitForStreet: false, // Hides autocomplete suggestions until a street is entered
AutoVerify:true,
addresses:
[{
ID: 'Complainant1',
street: '#complainantOneStreetAddress',
city: '#complainantOneCity',
state: '#complainantOneState',
zipcode: '#complainantOneZip'
}
,
{
ID: 'Complainant2',
street: '#complainantTwoStreetAddress',
city: '#complainantTwoCity',
state: '#complainantTwoState',
zipcode: '#complainantTwoZip'
},
{
ID: 'Suspect',
street: '#suspectStreetAddress',
city: '#suspectCity',
state: '#suspectState',
zipcode: '#suspectZip'
},
{
ID: 'Vehicle',
street: '#vehicleOwnerAdddress',
city: '#vehicleOwnerCity',
state: '#vehicleOwnerState',
zipcode: '#vehicleOwnerZip'
},
{
ID: 'BusinessInfo',
street: '#businessStreetAddress',
city: '#businessCity',
state: '#businessState',
zipcode: '#businessZip'
}
]
});
The problem is that it is displaying 5 tick marks on one field, which are overlapping each other. The class name is .Smarty-tag for all ticks as it is being called through API.
How can I solve this problem? Only that tick should show with the field that is bound to it. Others should not.
