Question

我知道禁用的输入不会向服务器发布值。此外，复选框不能具有只读属性。我想获得“只读复选框”的功能，其中复选框被禁用，我可以读取页面帖子上复选框的值。

以下代码与我在应用程序中需要执行的操作类似。单击第一个复选框（RememberMe），我检查第二个复选框（严重）并向其添加disable属性。

以下是模型：

public class LogOnModel
{
    [Required]
    [Display(Name = "User name")]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [Display(Name = "Remember me?")]
    public bool RememberMe { get; set; }

    [Display(Name = "Seriously?")]
    public bool Seriously { get; set; }
}

以下是我的观点：

@using (Html.BeginForm("", "", FormMethod.Post, new { id = "userForm" }))
{
<div>
    <fieldset>
        <legend>Account Information</legend>

        <div class="editor-label">
            @Html.LabelFor(m => m.UserName)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(m => m.UserName)
            @Html.ValidationMessageFor(m => m.UserName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(m => m.Password)
        </div>
        <div class="editor-field">
            @Html.PasswordFor(m => m.Password)
            @Html.ValidationMessageFor(m => m.Password)
        </div>

        <div class="editor-label">
            @Html.CheckBoxFor(m => m.RememberMe)
            @Html.LabelFor(m => m.RememberMe)
        </div>

        <div class="editor-label">
            @Html.CheckBoxFor(m => m.Seriously)
            @Html.LabelFor(m => m.Seriously)
        </div>

        <p>
            <input type="button" value="Log On" onclick = "SubmitForm();"/>
        </p>
    </fieldset>
</div>
}

以下是视图中包含的js文件的精简内容：

function SubmitForm() {
    $.ajax({
        type: "POST",
        url: "/Account/LogOnAjax",
        cache: false,
        data: $("#userForm").serialize(),
        success: function (results) {
            showMessage(results);
        },
        error: 
            showMessage("error!");
        }
    });
}

function SeriouslyCheckEnable(value) {
    var SeriouslyCheckBox = $("input[name = 'Seriously']");
    if (value == "true") {
        SeriouslyCheckBox.attr('checked', 'checked');
        SeriouslyCheckBox.attr("disabled", "true");
    }
    else {
        SeriouslyCheckBox.removeAttr('checked');
        SeriouslyCheckBox.removeAttr('disabled');
    }
}

$(document).ready(function () {
    $("input[name='RememberMe']").click(function (e) { SeriouslyCheckEnable(($("input[name='RememberMe']:checked").val())); });
});

这是我正在调试的控制器：

    public ActionResult LogOnAjax(LogOnModel model)
    {
        bool seriously = model.Seriously;
        bool remMe = model.RememberMe;

        return Json("some message here", JsonRequestBehavior.AllowGet);
    }

现在，无论严重复选框的选中状态如何，我总是认真对待布尔变量。任何帮助将不胜感激。

Answer 1

正如您所说，不会发布已禁用的值。如果您想使用“禁用”值进行显示但发布隐藏值，则需要专门为显示目的创建一个附加属性。

<强> MODEL

public class LogOnModel
{
    [Required]
    [Display(Name = "User name")]
    public string UserName { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string Password { get; set; }

    [Display(Name = "Remember me?")]
    public bool RememberMe { get; set; }

    public bool Seriously { get; set; }

    [Display(Name = "Seriously?")]
    public bool SeriouslyDisplay { get; set; }
}

<强> HTML

<div class="editor-label">
    @Html.CheckBoxFor(m => m.SeriouslyDisplay)
    @Html.LabelFor(m => m.SeriouslyDisplay)
</div>

@Html.HiddenFor(m => m.Seriously)

<强> JAVASCRIPT

function SeriouslyCheckEnable(value) {
  $('#Seriously').val(value);
  $('#SeriouslyDisplay').prop('checked', value);
  $('#SeriouslyDisplay').prop('disabled', value);
}

仅显示属性实际上不必在显示模型中，您只需将其放在HTML中。我只是把它留在那里以便于阅读。

另外，我建议使用'checked'属性来切换javascript复选框，例如。这使得使用和阅读变得更加简单！

Answer 2

我很想标记user2395249提供的答案，因为答案让我朝着正确的方向前进。这就是我在AJAX帖子上找到正确值的方法：

型号：

我基本上添加了另一个名为SeriouslyHidden的属性。

[Display(Name = "Seriously?")]
public bool Seriously { get; set; }

public bool SeriouslyHidden { get; set; }

查看：

<div class="editor-label">
    @Html.HiddenFor(m => m.SeriouslyHidden)
    @Html.CheckBoxFor(m => m.Seriously)
    @Html.LabelFor(m => m.Seriously)
</div>

将我的JavaScript修改为以下内容：

$(document).ready(function () {
    $("input[name='RememberMe']").click(function (e) {
        var RememberMeCheckBoxValue = ($("input[name='RememberMe']:checked").val());
        SeriouslyCheck(RememberMeCheckBoxValue);
        SeriouslyDisable(RememberMeCheckBoxValue);
    });

    $("input[name='Seriously']").click(function (e) {
        SeriouslyCheck(($("input[name='Seriously']:checked").val()));
    });
});

function SeriouslyCheck(value) {
    $('#SeriouslyHidden').val(value);
    if (value == "true")
        $(SeriouslyCheckBox).attr('checked', 'checked');
    else
        $(SeriouslyCheckBox).removeAttr('checked');
}

function SeriouslyDisable(value) {
    if (value == "true")
        $(SeriouslyCheckBox).attr("disabled", "true");
    else
        $(SeriouslyCheckBox).removeAttr('disabled');
}

然后在控制器中我从

中检索了值

public ActionResult LogOnAjax(LogOnModel model)
{
    bool seriously = model.SeriouslyHidden;
    bool remMe = model.RememberMe;

    //do some processing here

    return Json("some message here", JsonRequestBehavior.AllowGet);
}

从已禁用的复选框中发布值

2 个答案: