MVC und EditorFor-Breite

Question

Kann ich die Breite eines EditorFor-Steuerelements in meiner Ansicht festlegen?

Ich habe ein paar Parameter festgelegt:

[Required, DisplayName("Payee Name"), StringLength(50)]
public string Name { get; set; }

Allerdings kann ich nicht scheinen, um die Breite des Textfeldes, die gerendert wird, zu setzen.

<table width="300" border="0" cellpadding="3" cellspacing="0">
    <tr>
        <td>
            <%=Html.LabelFor(m => m.Name)%>
        </td>
        <td>
            <%=Html.EditorFor(m => m.Name)%>
        </td>
    </tr>

Ist das irgendwie machbar?

Ich habe es versucht:

<%=Html.EditorFor(m => m.Name, new {width=50)%>

Aber keine Freude...

Answer 1

Wie bereits erwähnt, ist der richtige Ort dafür die site.css

input,
select,
textarea {
    max-width: 280px;
}

Sie können dort einen beliebigen Standardwert festlegen oder den Block entfernen, um den Bootstrap-Standardwert von 100 % zu erhalten. Ich persönlich habe die folgenden Optionen hinzugefügt, damit ich je nach Steuerelement und Feld leicht einige Änderungen vornehmen kann:

.form-control-25 {
    max-width: 25%;
}

.form-control-50 {
    max-width: 50%;
}

.form-control-75 {
    max-width: 75%;
}

.form-control-100 {
    max-width: 100%;
}

Answer 2

Möglicherweise müssen Sie dem css-Attribut "!important" hinzufügen, um sicherzustellen, dass es den Standardwert für TextBoxFor überschreibt, z. B. width:50px !important;

Answer 3

Patrik Lindström hat Recht mit der Max-Breite.

Ich konnte das Problem umgehen, indem ich die Werte für max-width und width

@Html.EditorFor(model => model.Source, new { htmlAttributes = new { @class = "form-control", @placeholder = "Source",  @style = "width: 900px;max-width: 900px;" } })

Answer 4

Wenn Sie eine benutzerdefinierte Breite außerhalb einer normalen CSS-Regel benötigen und Sie Editor-Vorlagen verwenden, können Sie Folgendes tun

<%=Html.EditorFor(m => m.Name, new { Width = 50})%>

Dann fügen Sie in Ihrer Editorvorlage für String Folgendes hinzu

@Html.TextBox(s => {
...
    if (ViewBag.Width != null )
    {
       s.Width = ViewBag.Width;
    }
 }).Bind(Model).GetHtml()

Answer 5

In Ihrer CSS-Datei für Site.css ist die maximale Breite standardmäßig 280px, wenn Sie VS alles automatisch für Sie generieren lassen, wenn Sie das MVC-Projekt zum ersten Mal erstellen. Unabhängig davon, wie groß die Breite ist, die Sie für Ihre @html.editorfor mit einer gegebenen ID, wird sie durch die folgende Syntax begrenzt.

input,
select,
textarea{
     max-width:280px
}

Sie können sie hier ändern, indem Sie ihr eine neue Maximalbreite oder Maximalhöhe geben.