1

我正在使用 Smarty Street 的 LiveAddress jQuery 插件(2.4 分支)。有时,在加载表单时已经提供了地址。在页面加载时验证预加载地址的最佳方法是什么?

例如形式:

<input id="address" value="20 N. Main St" />
<input id="city" value="Greenville" />
<input id="state" value="SC" />
<input id="zip" value="29601" />

例如 javascript:

// set up Address Verification Service
var liveaddress = $("#DeliveryAddress").LiveAddress({
    key: "0000000000",
    autoVerify: true,
    submitVerify: false,
    invalidMessage: "Address Not Found. Click X to continue anyway.",
    addresses: [{
        id: 'DeliveryAddress',
        street: '#address',
        city: '#city',
        state: '#state',
        zipcode: '#zip'
    }]
});

到目前为止,我已经尝试过:

liveaddress.verify( 'DeliveryAddress' );

这确实会验证地址,但不会更新验证按钮,因此显然它不会触发所有事件。这是调试模式显示的内容:

LiveAddress API jQuery Plugin version 2.4.11 (Debug mode)
Manually mapping fields given this data: 
Finished mapping address with ID: DeliveryAddress
EVENT: FieldsMapped (Fields mapped to their respective addresses)
EVENT: VerificationInvoked (Address verification invoked)
EVENT: RequestSubmitted (Request submitted to server)
EVENT: ResponseReceived (Response received from server, but has not been inspected)
EVENT: AddressWasValid (Response indicates input address was valid)
EVENT: AddressAccepted (Address marked accepted)
EVENT: Completed (All done)
EVENT: MapInitialized (Mapped fields have been wired up to the window, document, and UI)

实际上单击验证按钮会触发相同的事件。

马特回答的最终解决方案:

liveaddress.on("MapInitialized", function(event, data, previousHandler) {
    previousHandler(event, data);
    liveaddress.verify( 'DeliveryAddress' );
});
4

3 回答 3

2

要检查的两件事:

  1. change在任何字段的值以编程方式更改后,需要触发该事件。确保change在填充字段后调用事件

  2. 从您的调试输出看来,验证就像是在 UI 初始化之前进行的;在进行验证之前,请确保一切都已完成初始化。

于 2014-05-20T21:04:15.283 回答
1

我有完全相同的要求,我想出了这个解决方案,它将标记地址有效也显示绿色勾号,而无需调用 SmartyStreet(因为您正在加载已经验证的地址,所以为什么要再次调用?),这将如果客户尝试更改地址,也要注意它会触发验证。

我的项目在 ASP.NET 中,所以我根据地址是新地址还是现有地址来加载以下 javascript,如果是新地址,我不加载此 javascript,如果 Exisitng 我加载此脚本。

 <% if(!NewAddress){%>

          liveaddress.on("MapInitialized", function (event, data, previousHandler) {
             var Address = liveaddress.getMappedAddressByID('billing'); 
             Address.accept();
             $("a[data-addressid='billing']").removeClass('smarty-tag-grayed').addClass('smarty-tag-green');
        previousHandler(event, data);
       });
<%}%>
于 2014-05-22T17:46:06.557 回答
0

工作演示

attr 用于获取默认值,prop 用于获取更改值

var get=$("#address");
    var defaulutValue=get.attr("value");  // to get default value
    var changeValue=get.prop("value");    // to get changed value
于 2014-05-20T13:33:46.743 回答