ASP.NET MVC3 Razor에서 읽기 전용 텍스트 상자를 만드는 방법


118

Razor보기 엔진을 사용하여 ASP.NET MVC3에서 읽기 전용 텍스트 상자를 만드는 방법은 무엇입니까?

이를 수행 할 수있는 HTMLHelper 메서드가 있습니까?

다음과 같은 것?

@Html.ReadOnlyTextBoxFor(m => m.userCode)

답변:


246
@Html.TextBoxFor(m => m.userCode, new { @readonly="readonly" })

이를 위해 HTML Helper를 만들 수 있지만 이것은 단순히 다른 것과 마찬가지로 HTML 속성 일뿐입니다. 다른 속성을 가진 텍스트 상자에 대한 HTML 도우미를 만드시겠습니까?


1
@Shyju 죄송합니다 . 속성 의 @접두사 가 누락되었습니다 readonly. 내 편집을 참조하십시오.

7
앞으로 동적 개체 인수에 속성을 추가하는 동안 오류가 발생하면 @. 당신은 보통 일치 HTML은 (등 읽기 전용, 클래스, 같은) 속성 것을 키워드를 볼 수 있습니다
브래드 크리스티

10
@BradChristie : 아니요; C # 키워드 @와 일치하는 속성 만 사용 하면됩니다 .
SLaks

1
@BradChristie : 귀하의 의견을 잘못 읽었습니다 ( "키워드"가 모호했습니다)
SLaks

1
: 당신이있는 경우 여러 HTML은 같은 것을 할 수있는 속성@Html.TextBoxFor(m => m.userCode, new { @readonly="readonly", @class="form-control" })
benscabbia

32

업데이트 : 이제 기본 편집기 템플릿에 HTML 속성을 추가하는 것은 매우 간단합니다. 다음을 수행하는 대신 필요합니다.

@Html.TextBoxFor(m => m.userCode, new { @readonly="readonly" })

간단히 이렇게 할 수 있습니다.

@Html.EditorFor(m => m.userCode, new { htmlAttributes = new { @readonly="readonly" } })

이점 : .TextBoxFor템플릿을 위해 등 을 호출 할 필요가 없습니다 . 전화 만하세요 .EditorFor.


@Shark의 솔루션이 올바르게 작동하고 간단하고 유용하지만 내 솔루션 (항상 사용하는)은 다음과 같습니다. Create an editor-templatethat can handle the readonlyattribute :

  1. EditorTemplates에서 이름이 지정된 폴더 만들기~/Views/Shared/
  2. PartialView명명 된 면도기 만들기String.cshtml
  3. 채우기 String.cshtml이 코드 :

    @if(ViewData.ModelMetadata.IsReadOnly) {
        @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue,
            new { @class = "text-box single-line readonly", @readonly = "readonly", disabled = "disabled" })
    } else {
        @Html.TextBox("", ViewData.TemplateInfo.FormattedModelValue,
            new { @class = "text-box single-line" })
    }
  4. 모델 클래스에서 [ReadOnly(true)]원하는 속성에 속성을 입력하십시오 readonly.

예를 들면

public class Model {
    // [your-annotations-here]
    public string EditablePropertyExample { get; set; }

    // [your-annotations-here]
    [ReadOnly(true)]
    public string ReadOnlyPropertyExample { get; set; }
}

이제 Razor의 기본 구문을 간단히 사용할 수 있습니다.

@Html.EditorFor(m => m.EditablePropertyExample)
@Html.EditorFor(m => m.ReadOnlyPropertyExample)

첫 번째 text-box는 다음과 같은 법선을 렌더링합니다 .

<input class="text-box single-line" id="field-id" name="field-name" />

그리고 두 번째는 렌더링됩니다.

<input readonly="readonly" disabled="disabled" class="text-box single-line readonly" id="field-id" name="field-name" />

당신은 모든 유형의 데이터에 대해이 솔루션을 사용할 수 있습니다 ( DateTime, DateTimeOffset, DataType.Text, DataType.MultilineText등). 그냥를 작성 editor-template.


2
"ViewData.ModelMetadata.IsReadOnly"를 사용했기 때문에 +1했습니다. 내가 MVC 버전 4에서 계정에이 물건을 걸릴 것이라고 예상하고 있었다
cleftheris

우리가 지금 버전 5에 있고, MVC는 여전히 그들을하지 않았다 잘 @cleftheris)
ravy amiry

2
@Javad_Amiry-좋은 대답-구현해 보았고 Scaffolded Edit 페이지에서 저장을 클릭 할 때까지 훌륭하게 작동하는 것 같았습니다. 그런 다음 [ReadOnly (true)] 속성을 사용하면 실제 속성 값 대신 데이터베이스에 NULL이 전송됩니다.
Percy

5

TextBoxFor를 사용한 솔루션은 괜찮지 만 EditBox stylish (사용자에게 약간 혼란 스러울 수 있음) 과 같은 필드를 보지 않으려면 다음과 같이 변경해야합니다.

  1. 변경 전 Razor 코드

    <div class="editor-field">
         @Html.EditorFor(model => model.Text)
         @Html.ValidationMessageFor(model => model.Text)
    </div>
  2. 변경 후

    <!-- New div display-field (after div editor-label) -->
    <div class="display-field">
        @Html.DisplayFor(model => model.Text)
    </div>
    
    <div class="editor-field">
        <!-- change to HiddenFor in existing div editor-field -->
        @Html.HiddenFor(model => model.Text)
        @Html.ValidationMessageFor(model => model.Text)
    </div>

일반적으로이 솔루션은 필드 편집을 방지하지만 그 가치를 보여줍니다. 코드 숨김 수정이 필요하지 않습니다.


1
에디터-필드와 디스플레이-필드 클래스를위한 CSS가 여기에 있으면 정말 도움이 될 것 같습니다.
DOK

"이 솔루션은 파일링을 편집하지 못하도록합니다" (이해할 수없는 것 같음) 란 무엇을 의미 합니까? 여기에있는 의견이 아닌 귀하의 답변수정하여 응답 해주십시오 (적절한 경우).
Peter Mortensen

3

@Bronek 및 @Shimmy의 이전 답변에 대한 크레딧 :

이것은 ASP.NET Core에서 동일한 작업을 수행 한 것과 같습니다.

<input asp-for="DisabledField" disabled="disabled" />
<input asp-for="DisabledField" class="hidden" />

첫 번째 입력은 읽기 전용이고 두 번째 입력은 컨트롤러에 값을 전달하고 숨겨집니다. ASP.NET Core로 작업하는 사람에게 유용하기를 바랍니다.


0
 @Html.TextBox("Receivers", Model, new { @class = "form-control", style = "width: 300px", @readonly = "readonly" })

1
설명이 필요합니다.
Peter Mortensen

0
@Html.TextBoxFor(model => model.IsActive, new { readonly= "readonly" })

이것은 텍스트 상자에 적합합니다. 그러나 동일한 작업을 수행 checkbox하려는 경우 사용하는 경우 다음을 사용하십시오.

@Html.CheckBoxFor(model => model.IsActive, new { onclick = "return false" })

그러나 사용하지 마십시오. disabledisable은 항상 서버에 기본값을 전송하므로 false선택 또는 선택 취소 상태였습니다. 그리고 readonly확인란 및 radio button. 필드 readonly에서만 작동 text합니다.


드롭 다운 목록은 어떻습니까?
user3020047

이것이 도움이 될 수 있기를 바랍니다. stackoverflow.com/questions/1636103/…
gdmanandamohon

0

아래 코드를 사용하여 TextBox를 읽기 전용으로 만들 수 있습니다.

방법 1

 @Html.TextBoxFor(model => model.Fields[i].TheField, new { @readonly = true })

방법 2

@Html.TextBoxFor(model => model.Fields[i].TheField, new { htmlAttributes = new {disabled = "disabled"}})
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.