已禁用複選框的帖子值

Question

我知道禁用的輸入不會將值發佈到服務器。另外，複選框不能具有隻讀屬性。 我想獲得「只讀」複選框的功能，其中複選框被禁用，我可以讀取頁面文章中複選框的值。

以下代碼與我在我的應用程序中需要執行的操作類似。點擊第一個複選框（RememberMe），我檢查第二個複選框（認真）並將禁用屬性添加到它。

這裏是模型：

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); 
    } 

現在，無論嚴重複選框的選中狀態如何，我都會嚴重地爲布爾變量獲取false。任何幫助，將不勝感激。如您所說，

Answer 1

我試圖標記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); 
} 

Answer 2

禁用的值不會被髮布。如果您想要將「禁用」值用於顯示目的，但發佈了隱藏值，則需要專門爲顯示目的創建附加屬性。

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); 
} 

顯示屏僅正確ty實際上並不一定在顯示模型中，你只需要將其放入HTML中即可。爲了便於閱讀，我只是把它留在那裏。

此外，我會建議使用'checked'屬性來切換帶有javascript的複選框，如示例中所示。它使得它更簡單的使用和閱讀！