如何在同一页面中对两个表单应用SmartiStreets验证？

Question

"'. col-md-6%h3美国地址

%form.form-horizontal%标签街道地址%input.form控件{id:'Street'，name:'Street'，style:'margin bottom:10px；font size:13px；height:30px'}

%标签城市%input。表单控件{id:'City'，名称：'City'，样式：'margin bottom:10px；字体大小：13px；高度：30px'}

%标签状态%input.form控件{id:'State'，name:'State'，style:'margin bottom:10px；font size:13px；height:30px'}

%标签邮政编码%input.form控件{id:'zipcode'，名称：'zipcode'，样式：'margin bottom:10px；字体大小：13px；高度：30px'}

.row%br%br%input.btn.btn-ss-alt.btn-lg{type:“提交”，name:“提交”，style:“页边距底部：20px；float:右侧；页边距右侧：15px；padding:10px 72px；”}

.col-md-6%h3国际地址

%form.form-horizontal%标签街道地址%input.form控件{id:'Street'，name:'Street'，style:'margin bottom:10px；font size:13px；height:30px'}

%标签城市%input。表单控件{id:'City'，名称：'City'，样式：'margin bottom:10px；字体大小：13px；高度：30px'}

%标签状态%input.form控件{id:'State'，name:'State'，style:'margin bottom:10px；font size:13px；height:30px'}

%标签邮政编码%input.form控件{id:'zipcode'，名称：'zipcode'，样式：'margin bottom:10px；字体大小：13px；高度：30px'}

. row%br%br%input.btn.btn-ss-alt.btn-lg{类型："提交"，名称："提交"，样式："边距-底部： 20px；浮点：右；边距-右： 15px；填充： 10px 72px;"} ```

这个插件只适用于第一种形式，没有第二种。

var liveaddress=$.liveaddress（{key:{ENV['SMARTY_STREETS']}，debug:true，地址：[{street:'#street'，city:'#city'，state:'#state'，zipcode:'#zipcode}}）




Answer 1

简单，只需将每个表单包装在一个表单标记中，并为每个字段指定一个不同的名称（或id）。插件会把它接起来。下面是使用自定义字段映射的两个表单的示例：

http://jsfiddle.net/p02qxh0L/69/

下面是一个使用自动映射在同一页面上的16个表单的示例：

https://smartystreets.com/docs/plugin/examples

HTML示例：

    <form id="shipping">
    <input type="text" id="pais" name="pais" placeholder="pais">
    <br>
    <br>
    <input type="text" id="calle" name="calle" placeholder="calle">
    <br>
    <input type="text" id="ciudad" name="ciudad" placeholder="ciudad">
    <br>
    <input type="text" id="estado" name="estado" placeholder="estado">
    <br>
    <input type="text" id="codigo" name="codigo" placeholder="codigo">
    <br>
</form>
<hr>
<form id="billing">
    <input type="text" id="pais2" name="pais2" placeholder="pais2">
    <br>
    <br>
    <input type="text" id="calle2" name="calle2" placeholder="calle2">
    <br>
    <input type="text" id="ciudad2" name="ciudad2" placeholder="ciudad2">
    <br>
    <input type="text" id="estado2" name="estado2" placeholder="estado2">
    <br>
    <input type="text" id="codigo2" name="codigo2" placeholder="codigo2">
    <br>
</form>  
    

示例Javascript

    evar ss = jQuery.LiveAddress({
    key: '5640108848371823003',
    waitForStreet: true, 
    debug: true,
    addresses: [{
        country: '#pais',
        street: '#calle',
        city: '#ciudad',
        state: '#estado',
        zipcode: '#codigo'
    },{
        country: '#pais2',
        street: '#calle2',
        city: '#ciudad2',
        state: '#estado2',
        zipcode: '#codigo2'
    }]
});