asp.net mvc thêm css vào editorfor?

Question

Tôi muốn thay đổi kiểu của hộp soạn thảo 'editor for' từ MVC, cụ thể là tôi muốn làm cho hộp văn bản lớn hơn.

Tôi đã thử thêm css một vài cách, không có kết quả.

bao gồm:

<td class="myCss"><%=Html.EditorFor(x => x.NickName)%></td> 

và

<td class="myCss"><%=Html.EditorFor(x => x.NickName, new { @class = "myCss" })%></td> 

giúp đỡ pls!

Answer 1

Hãy thử điều này

<%= Html.TextBoxFor(x => x.NickName, new { @class = "myCss" })%> 

hoặc

<%= Html.TextAreaFor(x => x.NickName, new { cols = "40%", @class = "myCss" })%> 

Bây giờ bạn có thể định nghĩa các thuộc tính của bạn bởi vì MVC biết những gì loại để sử dụng (TextArea).

Answer 2

robh,

thật khó để biết câu hỏi của bạn cho dù bạn đang tìm kiếm giải pháp 'chung chung' hoặc cụ thể trong dự án của bạn. như vậy, tôi sẽ giải quyết vấn đề chung - hoạt động một lần, hoạt động ở mọi nơi.

điều này đòi hỏi phải thực hiện một vài bước (thông qua cấu hình). về cơ bản đây là những gì cần thiết:

• tạo thư mục mới theo 'views-> chia sẻ gọi biên tập Templates'
• tạo usercotrol mới (ascx) tập tin dưới đó gọi là 'string.ascx'

bây giờ, xác định rằng file ascx theo:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<string>" %> 
<div class="editor-label"> 
    <%= Html.LabelFor(model => model) %> 
</div> 
<div class="new-editor-field"> 
    <%= Html.TextBoxFor(model => model) %> 
    <%= Html.ValidationMessageFor(model => model) %> 
</div> 

này sẽ n ow thực hiện tất cả các cuộc gọi EditorFor() dựa trên chuỗi 'sử dụng' mẫu 'này. chỉ đơn giản là làm cho 'new-editor-field' của lớp phản ánh phong cách css mong muốn của bạn cho trường đó. rõ ràng, nấu theo yêu cầu của riêng bạn (nghĩa là bạn có thể không muốn LabelFor tat vv ..)

hy vọng điều này sẽ giúp - đây là một trong số ít cách để làm điều này (nhưng là của tôi cách ưa thích).

thưởng thức

jim

Answer 3

Nơi kết quả của EditorFor bên trong một div với một số thuộc tính lớp trên nó, và bên trong định nghĩa kiểu cho lớp này, sử dụng! Chỉ thị quan trọng để buộc chấp nhận các giá trị mong muốn để bất cứ điều gì bên trong div .

Answer 4

Hãy thử điều này,

https://stackoverflow.com/a/4249988/505474

sao chép từ trên cao liên kết,

@model DateTime? 

@Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { @class = "datePicker" }) 

Nó làm việc cho tôi ...

Answer 5

Thay vì đòi hỏi lĩnh vực đầu vào của bạn để có lớp trực tiếp áp dụng, bạn có thể sử dụng như sau:

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

mà kết quả trong khoảng HTML sau

<div class="editor-field myCss"> 
    <input class="text-box single-line" data-val="true" id="Nickname" name="Nickname" type="text" value=""> 
</div> 

Sau đó, chỉ cần sử dụng quy tắc CSS để tạo kiểu thích hợp

.myCss input.text-box {font-size: 2em;}