Comment créer une zone de texte en lecture seule dans ASP.NET MVC3 Razor

Comment créer une zone de texte en lecture seule dans ASP.NET MVC3 avec le moteur de vue Razor?

Existe-t-il une méthode HTMLHelper disponible pour cela?

Quelque chose comme ce qui suit?

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

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

Vous êtes invités à créer un HTML Helper pour cela, mais il ne s'agit que d'un attribut HTML comme les autres. Feriez-vous un HTML Helper pour une zone de texte qui a d'autres attributs?

MISE À JOUR: Il est maintenant très simple d'ajouter des attributs HTML aux modèles d'éditeur par défaut. Cela signifie au lieu de faire ceci:

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

vous pouvez simplement faire ceci:

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

Avantages: vous n'avez pas besoin d'appeler .TextBoxFor, etc. pour les modèles. Appelez .EditorFor.

Bien que la solution de @ Shark fonctionne correctement, et qu'elle soit simple et utile, ma solution (que j'utilise toujours) est celle-ci: créer un attribut editor-templatequi peut gérerreadonly :

1. Créez un dossier nommé EditorTemplatesdans~/Views/Shared/
2. Créez un rasoir PartialViewnomméString.cshtml

3. Remplissez le String.cshtmlavec ce code:

   @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. Dans la classe de modèle, placez l' [ReadOnly(true)]attribut sur les propriétés que vous souhaitez être readonly.

Par exemple,

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

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

Vous pouvez maintenant utiliser la syntaxe par défaut de Razor simplement:

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

Le premier rend un normal text-boxcomme ceci:

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

Et le second rendra à;

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

Vous pouvez utiliser cette solution pour tout type de données ( DateTime, DateTimeOffset, DataType.Text, DataType.MultilineTextetc.). Créez simplement un fichier editor-template.

La solution avec TextBoxFor est OK, mais si vous ne voulez pas voir le champ comme EditBox élégant (cela peut être un peu déroutant pour l'utilisateur), impliquez les modifications suivantes:

1. Code Razor avant les modifications

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

2. Après les changements

   <!-- 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>

En général, cette solution empêche la modification du champ, mais en montre la valeur. Il n'est pas nécessaire de modifier le code-behind.

Avec les crédits à la réponse précédente de @Bronek et @Shimmy:

C'est comme si j'avais fait la même chose dans ASP.NET Core:

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

La première entrée est en lecture seule et la seconde transmet la valeur au contrôleur et est masquée. J'espère que cela sera utile pour quelqu'un qui travaille avec ASP.NET Core.

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

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

C'est très bien pour la zone de texte. Cependant, si vous essayez de faire de même pour le, checkboxessayez de l'utiliser si vous l'utilisez:

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

Mais ne l'utilisez pas disable, car disable envoie toujours la valeur par défaut falseau serveur - qu'il soit à l'état coché ou non coché. Et le readonlyne fonctionne pas pour la case à cocher et radio button. readonlyne fonctionne que pour les textchamps.

Vous pouvez utiliser le code ci-dessous pour créer une zone de texte en lecture seule.

Méthode 1

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

Méthode 2

@Html.TextBoxFor(model => model.Fields[i].TheField, new { htmlAttributes = new {disabled = "disabled"}})