EditorFor - Aplicar uma classe CSS

Question

Pessoal,

Estou tentando aplicar um CSS no meu EditorFor mas quando o Html é gerado esta acontecendo algo estranho, veja:

@Html.EditorFor(model => model.Cliente.DataAtividade, new { @class = "textBoxForClass" })

E o Html gerado:

<input class="text-box single-line" data-val="true" data-val-date="O campo Início da Atividade deve ser uma data." id="Cliente_DataAtividade" name="Cliente.DataAtividade" type="date" value="13/04/1979" />

O nome da classe é totalmente diferente. Neste caso como devo fazer?

Obrigado!

Answer 1

O EditFor não possui o parametro htmlAttribute que serve para fazer o que você está tentando.. no seu caso o parametro @class está sendo considerado um additionalViewData.

O que você pode fazer é colocar a class dentro do seu editorTemplate(se você possui, caso contrário não use o EditorFor).

Ou você tambem pode acessar esse parametro @class no seu editor template:

@model dynamic

<input type="text" class="@model.class" />

---

http://www.linkedin.com/pub/murilo-kunze/44/191/455

Answer 2

Vc pode usar um TextBox nesse caso =)

@Html.TextBoxFor(model => model.Cliente.DataAtividade, new { @class = "textBoxForClass" })

Answer 3

já tentou fazer manualmente, tipo: 

 new { size = 15, maxLength = 10 })

?

Ou não?

Se sim, O que deu????

---

Aprendendo Ad Eternum Se minha resposta foi útil por favor marque, se minha resposta respondeu completamente sua dúvida, marque-a como resposta, se houve outra resposta melhor, marque ela. Assim facilita a busca e melhora a organização do fórum e o nosso aprendizado.

Answer 4

Já o @Html.TextBoxFor aceita eu passar uma classe no parametro mas em contrapartida ele ja nao acata esta formatacao que coloquei no annotation: [DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:dd/MM/yyyy}")]

Desconheço este editorTemplate mas vou dar uma olhada aqui na net pra ver do que se trata.

obrigado Murilo

Answer 5

Algo me diz que vc vai tentar adicionar o Datepicker ai depois. Aqui explica o Datepicker e templates xD

Templates

Answer 6

Sim, no caso vou usar um Datepicker mesmo.

Answer 7

Para usar os EditorTemplates e DisplayTemplates

Dentro da pasta Views\Shared crie duas pastas:

\Views\Shared\EditorTemplates

\Views\Shared\DisplayTemplates

Exemplo para um EditorTemplate do tipo DateTime:

Crie um arquivo dentro da pasta \Views\Shared\EditorTemplates com o nome de DateTime.cshtml:

@model DateTime?
@Html.TextBox("", (Model.HasValue ? Model.Value.ToString("d", System.Globalization.CultureInfo.CurrentCulture) : string.Empty), 
new { @class = "datepicker", maxlength = 10, @readonly = true })  

Através da classe css "datepicker" você finaliza o design do seu campo de formulário ou pode acionar o datepicker do jquery.

Sempre que você usar o EditorFor em um tipo DateTime o código renderizado será o do arquivo DateTime.cshtml

Lembrando que você pode usar essa técnica para tipos complexos também.

Fiz um tutorial mais completo que pode ser visto aqui:

http://pilulamvc.blogspot.com.br/2013/01/usando-editortemplates-e.html

Answer 8

Amigo, você pode é setar ids, ao invés de classe, fica um pouco menos semântico, mas fica funcional.

Outra solução seria como descrito pelo nosso amigo Omnislash009 ou então fazer o campo em html puro, sem usar os Html.Helpers

<input type="text" name="nome" required="required" id="xx" class="zz" />

ps. Se útil, gentileza marcar como resposta. :)

Answer 9

No caso tive que usar o TextBoxFor mesmo para resolver.