在POST表单时将复选框绑定到模型

时间:2012-04-11 00:43:10

标签: c# jquery html asp.net-mvc-3 checkbox

这是我的简单课程:

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using XXX.Domain;

namespace XXX.WebUI.Models
{
    public class AccountRegisterModel
    {
        ..snip..

        [Required(ErrorMessage = "You must agree to our terms of use.")]
        public bool AcceptedTerms { get; set; }

        ..snip..
    }
}

我的观点:

<div class="terms">
    <input type="checkbox" name="AcceptedTerms" value="AcceptedTerms"  />
    <img class="sim" src="@Url.Content("~/Public/images/unchecked.gif")" alt="accept the terms" />
    <p>I accept the <span class="legalize">Terms of Service &amp; Privacy Policy</span> and wish to continue</p>
</div>

视图开始时未选中复选框并使用一些Javascript代码我使用图像创建一个时髦的复选框,并在幕后更新复选框,以便回发正确的值。

$('.terms input[type="checkbox"]').prop("checked", true);

出于调试目的,我在“隐藏的”实际复选框中添加了display:block规则,以查看当我点击图片时是否实际勾选了支票,我可以确认情况确实如此。

另外,使用Firebug,这是我点击图片时显示的HTML,勾选了复选框:

<input type="checkbox" name="AcceptedTerms" value="AcceptedTerms">

发布表单时,AcceptedTerms的值仍为false,就好像该值未发布回我的服务器一样。也许HTML缺少一个我不知道的属性。

有任何想法或建议吗?

2 个答案:

答案 0 :(得分:0)

<input type="checkbox" name="AcceptedTerms" value="AcceptedTerms"  />

应改为

<input type="checkbox" name="AcceptedTerms" value="true"  />

值必须为true而不是AcceptedTerms。

如果您使用@ Html.CheckBoxFor(x =&gt; x.AcceptedTerms)

您将看到该值设置为true。

答案 1 :(得分:0)

保留将复选框绑定到视图模型所需的值。我会这样:

@Html.CheckBoxFor(x => x.AcceptedTerms)

当您的表单发布时,它应该具有复选框的值,即。如果检查(真实)或不检查(假)。