Як створити текстове поле лише для читання у ASP.NET MVC3 Razor


118

Як створити текстове поле для читання лише в ASP.NET MVC3 за допомогою системи перегляду Razor?

Чи доступний метод HTMLHelper для цього?

Щось на зразок наступного?

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

Відповіді:


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

Ви можете створити HTML-помічник для цього, але це просто лише атрибут HTML, як і будь-який інший. Чи зробите ви помічник HTML для текстового поля, яке має інші атрибути?


1
@Shyju Вибачте, мені не вистачало @префіксу readonlyвластивості. Дивіться мою редакцію.

7
Надалі, якщо ви отримаєте будь-які помилки, додаючи властивості до аргументу динамічного об'єкта, ви можете встановити їх за допомогою @. Зазвичай ви бачите його лише з ключовими словами, які відповідають атрибутам HTML (наприклад, лише для читання, клас тощо)
Бред Крісті,

10
@BradChristie: Ні; вам потрібно лише @використовувати атрибути, які відповідають ключовим словам C # .
СЛАкс

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 працює правильно, і воно є простим і корисним, моє рішення (яке я завжди використовую) саме таке: Створіть атрибут, editor-templateякий може оброблятиreadonly :

  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
+1, оскільки ви використовували "ViewData.ModelMetadata.IsReadOnly". Я очікував, що MVC врахує ці речі у версії 4.
cleftheris

@cleftheris добре, ми зараз у версії 5, а MVC досі їх не сприймав;)
ravy amiry

2
@Javad_Amiry - чудова відповідь - я реалізував це, і, здавалося, він спрацював чудово, поки я не натиснув кнопку "Зберегти" на лісовій сторінці "Редагувати". Тоді виявляється, що властивості з функцією [ReadOnly (true)] призведуть до того, що NULL буде надіслано до бази даних замість реального значення властивості - чи стикалися ви з цим?
Персі

5

Рішення з TextBoxFor добре, але якщо ви не хочете бачити таке поле, як EditBox стильним (це може бути трохи заплутано для користувача), введіть такі зміни:

  1. Код бритви перед змінами

    <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

Що ви маєте на увазі під "цим рішенням вимкнено подання проти редагування" (це здається незрозумілим)? Будь ласка, дайте відповідь, відредагувавши свою відповідь , а не тут, у коментарях (якщо потрібно).
Пітер Мортенсен

3

З кредитами до попередньої відповіді @Bronek та @Shimmy:

Це так, як я робив те ж саме в ASP.NET Core:

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

Перший вхід зчитується лише вдруге, а другий передає значення контролеру і приховано. Сподіваюся, це стане в нагоді тому, хто працює з ASP.NET Core.



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

Це просто чудово для текстового поля. Однак якщо ви намагаєтесь зробити те ж саме для цього, checkboxто спробуйте скористатися цим, якщо ви його використовуєте:

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

Але не використовуйте disable, тому що вимкнення завжди надсилає falseсервер значення за замовчуванням - або воно було у перевіреному або не перевіреному стані. І readonlyне працює для прапорця і radio button. readonlyпрацює лише для textполів.


А як щодо випадаючих списків?
користувач3020047

Сподіваюся , що це може допомогти 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"}})
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.