Comment puis-je ajouter un attribut de classe à un élément HTML généré par les HTML Helpers de MVC?

188

ASP.NET MVC peut générer des éléments HTML à l'aide des HTML Helpers, par exemple @Html.ActionLink(), @Html.BeginForm()et ainsi de suite.

Je sais que je peux spécifier des attributs de formulaire en créant un objet anonyme et passer cet objet pour le (quatrième dans ce cas) htmlAttributesparamètre où en spécifiant un idpour l'élément:

Html.BeginForm("Foo", "Bar", FormMethod.Post, new { id = "MyForm"})

Mais qu'en est-il de l' classattribut? Évidemment, cela ne fonctionne pas:

Html.BeginForm("Foo", "Bar", FormMethod.Post, new { class = "myclass"})

Comme cela lève simplement des erreurs de syntaxe aléatoires lorsque ma vue est demandée, car il attend autre chose après avoir rencontré le mot-clé C # class.

J'ai aussi essayé:

new { _class = "myclass"}

new { class_ = "myclass"}

Mais ils n'ont pas non plus fonctionné, car les traits de soulignement sont remplacés par des tirets .

Je sais que je peux aussi bien écrire les éléments HTML à la main ou envelopper le formulaire dans un <div class="myClass">, mais je serais toujours intéressé de savoir comment cela est censé être fait.

asp.net-mvc razor html-helper

— Adrian Grigore
source

Réponses:

348

Afin de créer un type anonyme (ou tout autre type) avec une propriété qui a un mot - clé réservé comme son nom en C #, vous pouvez préfixer le nom de la propriété avec un arobase, @:

Html.BeginForm("Foo", "Bar", FormMethod.Post, new { @class = "myclass"})

Pour VB.NET, cette syntaxe serait accomplie en utilisant le point, .qui dans ce langage est la syntaxe par défaut pour tous les types anonymes :

Html.BeginForm("Foo", "Bar", FormMethod.Post, new with { .class = "myclass" })

— Communauté
source

L'analyseur syntaxique n'est pas assez intelligent, OMI, s'il a besoin de cet indice étant donné le contexte dans lequel il se trouve à ce stade du code.

— toddmo

La meilleure pratique actuelle dans le développement CSS consiste à créer des sélecteurs plus généraux avec des modificateurs qui peuvent être appliqués aussi largement que possible sur tout le site Web. J'essaierais d'éviter de définir des styles séparés pour les éléments de page individuels.

Si le but de la classe CSS sur l' <form/>élément est de contrôler le style des éléments dans le formulaire, vous pouvez ajouter l'attribut de classe l' <fieldset/>élément existant qui encapsule n'importe quel formulaire par défaut dans les pages Web générées par ASP.NET MVC. Une classe CSS sur le formulaire est rarement nécessaire.

— Tim
source

Vous avez certainement raison, mais ce cas est différent. Je cherchais un moyen de spécifier des métadonnées pour quelques plugins jquery. Cela se fait généralement en utilisant mal l'attribut class.

— Adrian Grigore

Vous pouvez suggérer des bonnes pratiques, mais si j'ai un modèle qui utilise le CSS sur un formulaire, je ne vais pas aller massacrer le modèle pour le rendre "correct". La réalité est qu'un client ne paiera pas plus parce que vous avez fait la bonne chose en css ...

— Christian Payne

@ChristianPayne Ils pourraient être obligés de payer plus à l'avenir parce que vous ne l'avez pas fait.

— Ian Warburton

J'ai voté contre cette réponse parce qu'elle ne répond pas à la question. Une réponse plus appropriée répondrait d'abord à la question puis donnerait des conseils sur les meilleures pratiques.

— Ben