2010-04-16 82 views
34

我有我定義爲模型綁定有殘疾文本框

<%= Html.TextBox("Username", Model.Form.Username, 
     new { @class = "textbox", @disabled = "disabled" })%> 

在我的行動的文本框

[AcceptVerbs(HttpVerbs.Post)] 
    [ValidateAntiForgeryToken] 
    public ActionResult EditLogin(LoginForm post) { 

     ... 

     return View(model); 
    } 

post.Username將是空白,所有其他屬性綁定正確的,但如果我更改@禁用=「禁用@ readonly =」只讀「用戶名綁定正確,一切正常

它看起來像模型綁定忽略禁用字段中的值。我需要該字段的值綁定到模型。我可以使用只讀,但寧願使用禁用,因此用戶可以直觀地看到它們不能編輯字段的值。

回答

52

我相信一個禁用的表單字段不會提交任何內容。如果你有一個表單並禁用該表單中的foo字段,那麼當你發佈該帖子時將沒有foo字段的值。這只是在HTML中禁用字段的本質,並不是MVC問題。

+3

哇,我真不敢相信我還沒有碰到這個,要麼或完全忘了這回事。謝謝。 – modernzombie 2010-04-16 14:30:32

+0

它是一件容易忽略的事情,但Dan Diplo是正確的,在許多情況下,隱藏的領域是一個很好的選擇。出於好奇,你爲什麼禁用用戶名字段? – 2010-04-16 14:51:54

+0

我正在創建一個管理員可以爲系統創建新登錄的表單。當管理員正在編輯登錄名時,我禁用了用戶名(由於用戶名無法更改,所以名字和電子郵件都是可編輯的)。我決定只使用readonly,並且可以使用一些CSS來區別顏色。 – modernzombie 2010-04-16 14:55:47

5

如果您希望將值發回但不可編輯,請考慮將其置於隱藏字段中。顯然,不要爲需要某種安全性的任何事情做這件事,因爲用戶可以篡改它。

40

使用readonly - 將禁用輸入,但您仍然可以在綁定中使用它。 你可以在div上應用一個樣式,使它看起來變灰或許?

<div class="editor-label"> 
    @Html.LabelFor(model => model.FileName) 
</div> 
<div class="editor-field-greyed-out"> 
    @Html.TextBoxFor(model => model.FileName, new { @readonly = true }) 
    @Html.ValidationMessageFor(model => model.FileName) 
</div> 
+0

好的答案的OP ...謝謝:) – Tushar 2014-11-06 08:58:47

+1

來到這裏,因爲我有一個dropdownbox相同的問題,爲未來的脂肪酶只讀不工作爲一個下拉:) – FRoZeN 2015-08-21 09:45:24

5

您可以通過添加一個隱藏字段具有相同值做一個解決辦法;)提交殘疾人領域

<%= Html.Hidden("Username", Model.Form.Username)%> 
+0

因此,元素)並不是真正有效的HTML,並可能導致JavaScript頭疼。 – QMaster 2016-09-11 09:34:40

1

最簡單的方法是將其在複製到一個無形的,非禁用的控制之前提交。有些人手動創建這些控件,並在jQuery中與on change事件掛鉤以便按​​需複製它們,但下面的這個解決方案是通用的,簡單且不那麼簡單的 - 儘管一個規則是:您必須在回發後創建(呈現)乾淨頁面所以

$('#submitBtn').closest('form').one('submit', function() { 

    var $form = $(this); 

    // input, textarea, select, option, ----- button, datalist, keygen, output, optgroup 
    $form.find('input:disabled, textarea:disabled, select:disabled, option:disabled').each(function() { 

     var $item = $(this); 

     var hiddenItem = $item.clone(); 
     hiddenItem.removeAttr('id'); 
     hiddenItem.removeAttr('disabled'); 
     hiddenItem.attr('style', 'display: none'); 

     $item.after(hiddenItem); 
    }); 

}); 
+0

巧妙的傢伙!但你也可以做一些改變,並把這個方法放在工作上 – clement 2017-02-07 12:45:22

+0

這個工作 - 但過度。如果您已經使用jQuery,只需在提交時將disabled屬性更改爲false即可。看到我的答案。 – 2017-06-15 15:17:34

3

正如意見建議的文章,只讀,而不是禁用可以是一個選項,但它不適用於選擇框。而不是創建一個隱藏的輸入,你可以輸入或選擇爲禁用,並通過在提交時使用JavaScript更改禁用屬性仍然傳遞數據。

使用jQuery它會是這樣的:

$('form').on('submit', function(){ 
    $('input, select').prop('disabled',false); 
    return true; 
});