复选框切换到设置地址字段

Checkbox Toggle to Set Address Fields

本文关键字：设置 地址字段 复选框      更新时间：2023-09-26

我正在使用asp.net + MVC，并试图建立一个界面，其中一个将进入一个设施的地址。在某些情况下，设施可以具有与其所属机构相同的地址，我使用复选框(EditFor字段)来指示地址是否与机构相同。视图的强类型为Facility类，该类具有Institution类的虚拟属性。我的问题是，当单击复选框时，我希望代码更新地址字段，以显示机构的地址或清除字段，以便可以输入不同的地址。我有一些javascript，我用来隐藏/显示地址字段，但这不是我真正想要的。我如何收集模型数据，即机构和设施，并将其放置在EditFor字段中?

<

复选框字段/strong> 

<div class="form-group">
     @Html.LabelFor(model => model.Address1, htmlAttributes: new { @class = "control-label col-md-2" })
     <div class="col-md-10">
          @Html.EditorFor(model => model.Address1, new { htmlAttributes = new { @class = "form-control" } })
          @Html.ValidationMessageFor(model => model.Address1, "", new { @class = "text-danger" })
     </div>
</div>
JavaScript

$("#AddressSameAsInstitute").click(function () {
        $(".set-from-checkbox").toggle(!this.checked);
    });

如下所述，我相信我可以使用@Model.Institution…但我不确定使用什么javascript代码将设置EditFor控件的文本属性?

首先要说明的是:ASP使用的任何"控件"。NET提供的内容被转换成浏览器可以理解的HTML元素。例如，在大多数情况下，EditorFor控制转换为<input type='text' />。为了在javascript中与这些元素交互，你需要知道你在HTML文档中处理的是哪种类型的控件，而不是从。net的角度来看。

要将文本/值从javascript中的一个元素复制到另一个元素，您需要知道源和目标元素上的id(或class，如果它特定于每个元素)。使用JQuery，代码看起来像这样:

$('#chkCopyAddress').change(function () {
        if (this.checked) {
            $('#instAddress').val($('#facAddress').val());
            $('#instCity').val($('#facCity').val());
            $('#instState').val($('#facState').val());
        } else {
            $('#instAddress').val('');
            $('#instCity').val('');
            $('#instState').val('');
        }
    });

所以我建议在你用ASP.NET创建的元素上放一个id。当使用EditorFor控件时，看起来有重复id的空间(这违背了id的目的)，因为它似乎将模型的属性名称用于这篇MSDN文章中提到的id。

我还组合了一个小提琴来演示所需的功能，如果看到它的实际操作有帮助的话。

相关文章：