使用复选框自动更新字段

时间:2013-06-24 13:00:42

标签: javascript jquery asp.net-mvc

在我的MVC项目中,当客户创建一个帐户时,他们会提示您提供发票地址和送货地址。

我想要一个发票地址下方的复选框,该地址会使用相同的发票地址详细信息更新送货地址,而不必两次输入相同的地址。

不知道怎么做,任何帮助都会非常感激)复选框的一个例子是

<div class="checkbox">@Html.CheckBoxFor(m => signup.SameAddress)</div>
<div class="label">@Html.LabelFor(m => signup.SameAddress, T(Use same address as billing"))</div>

到目前为止,我的代码看起来像这样(下图)。 ATM他们必须两次输入相同的细节。

<article class="addresses form">
<fieldset>
    <div class="span5">
    <h2>@T("Invoice Address")</h2>

    <table class="table-bordered table-striped table">
        <colgroup>
            <col id="Col1" />
            <col id="Col2" />
        </colgroup>
        <thead>
            <tr>
                <th scope="col">@T("Name")</th>
                <td>@invoiceAddress.Name.Value</td>
            </tr>
            <tr>
                <th scope="col">@T("AddressLine1")</th>
                <td>@invoiceAddress.AddressLine1.Value<</td>
            </tr>              
        </thead>
    </table>
    </div>

    //insert checkbox here

    <div class="span5">
    <h2>@T("Billing Address")</h2>
    <table class="table-bordered table-striped table">
        <colgroup>
            <col id="Col1" />
            <col id="Col2" />
        </colgroup>
        <thead>
            <tr>
                <th scope="col">@T("Name")</th>
                <td>@shippingAddress.Name.Value</td>
            </tr>
            <tr>
                <th scope="col">@T("AddressLine1")</th>
                <td>@shippingAddress.AddressLine1.Value<</td>
            </tr>               
        </thead>

    </table>
    </div>
</fieldset>
</article>

我想使用JQuery或JS自动将送货地址更新为发票的相同地址。

感谢您的回复...

1 个答案:

答案 0 :(得分:1)

你需要一些东西来识别你的列,我在这里用输入标签和我可以选择的ID。

<input type="checkbox" id="test3"/>
<label for="test1">Invoice address</label><input id="test1" type="text"/>
<label for="test2">Shipping address</label><input id="test2" type="text"/>


$("#test1").on("change", function () {
    if ($("#test3").is(":checked"))
        $("#test2").val($(this).val()) ;
});