Javascript 复选框切换以设置地址字段
我正在使用asp.net+MVC并尝试构建一个界面,在其中输入设施的地址。在某些情况下,设施可以与它所属的机构拥有相同的地址,我使用复选框(EditFor字段)来指示地址是否与机构相同。视图是设施类的强类型视图,该类具有机构类的虚拟属性。我的问题是,当点击复选框时,我希望代码更新地址字段,以显示机构的地址或清除字段,以便输入不同的地址。我有一些javascript用来隐藏/显示地址字段,但这不是我真正想要的。如何收集模型数据,即机构和设施,并将其放置在EditFor字段中 复选框字段Javascript 复选框切换以设置地址字段,javascript,c#,jquery,asp.net,checkbox,Javascript,C#,Jquery,Asp.net,Checkbox,我正在使用asp.net+MVC并尝试构建一个界面,在其中输入设施的地址。在某些情况下,设施可以与它所属的机构拥有相同的地址,我使用复选框(EditFor字段)来指示地址是否与机构相同。视图是设施类的强类型视图,该类具有机构类的虚拟属性。我的问题是,当点击复选框时,我希望代码更新地址字段,以显示机构的地址或清除字段,以便输入不同的地址。我有一些javascript用来隐藏/显示地址字段,但这不是我真正想要的。如何收集模型数据,即机构和设施,并将其放置在EditFor字段中 复选框字段 <d
<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>
更新
如下所述,我相信我可以使用@Model.Institution。。。但我不确定使用什么javascript代码来设置EditFor控件的text属性 首先需要注意的是:ASP.NET提供的任何“控件”都被转换为浏览器可以理解的HTML元素。例如,控件的
编辑器在大多数情况下转换为
。为了在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
。在使用编辑器for
控件时,似乎存在重复id的空间(这违背了id的目的),因为它似乎将模型的属性名称用于id
,如中所述
我还列出了一些示例,以演示所需的功能,以防看到它的实际应用有所帮助。首先需要注意的是:ASP.NET提供的任何“控件”都会转换为浏览器可以理解的HTML元素。例如,
控件的编辑器在大多数情况下转换为
。为了在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
。在使用编辑器for
控件时,似乎存在重复id的空间(这违背了id的目的),因为它似乎将模型的属性名称用于id
,如中所述
我还总结了一些示例来演示所需的功能,以防看到它的实际应用有所帮助。刚刚有了一个想法。C#变量是否可用于JavaScript代码?因此我相信我可以使用@Model.Institution。。。但我不确定要使用什么javascript代码来设置EditFor控件的文本属性?请发布源html以了解与客户端相关的问题。我们不应该在心里解析你的服务器代码来弄清楚浏览器是如何看待它的,只是有一个想法。C#变量是否可用于JavaScript代码?因此我相信我可以使用@Model.Institution。。。但我不确定要使用什么javascript代码来设置EditFor控件的文本属性?请发布源html以了解与客户端相关的问题。Jonathank说,我们不应该在心里解析你的服务器代码来弄清楚浏览器是如何看待它的——我用的是.text=string,但它不起作用。目前我的问题是,当我尝试使用@Model.Institution.Name时,它给了我一个System.NullReferenceException:对象引用没有设置为对象的实例。没关系。在这件事上我有点像达达。我正在创建设施视图,因此还没有设施,因此也没有机构。谢谢你的帮助,也很抱歉给你带来困惑。谢谢,乔纳森-我使用的是.text=string,但它不起作用。目前我的问题是,当我尝试使用@Model.Institution.Name时,它给了我一个System.NullReferenceException:对象引用没有设置为对象的实例。没关系。在这件事上我有点像达达。我正在创建设施视图,因此还没有设施,因此也没有机构。谢谢你的帮助,很抱歉给你带来困惑。