如何使用Razor和VB.NET设置样式@ Html.BeginForm()

时间:2015-11-16 21:22:48

标签: asp.net-mvc vb.net html5 razor

我已经在网上搜索了很多答案,似乎无法突破。我正在尝试设置表单底部的消息框文本区域的最大高度。我正在使用VB.Net,MVC和Razor来尝试实现这一目标。如果我在C#中,我会知道如何写出来,但我想我没有足够的理解将其翻译成VB。我工作的公司使用VB,但没有人使用MVC所以我在这里独立。

守则:

@Using (Html.BeginForm())
                @Html.AntiForgeryToken()

            @<div class="form-horizontal">
                <h4>Notification</h4>
                <hr />
                @Html.ValidationSummary(True, "", New With {.class = "text-danger"})

                @*<div class="form-group">
                    @Html.LabelFor(Function(model) model.DateStart, htmlAttributes:=New With {.class = "control-label col-md-2"})
                    <div class="col-md-10">
                        @Html.EditorFor(Function(model) model.DateStart, New With {.htmlAttributes = New With {.class = "form-control"}})
                        @Html.ValidationMessageFor(Function(model) model.DateStart, "", New With {.class = "text-danger"})
                    </div>
                </div>*@

                <div class="form-group">
                    @Html.LabelFor(Function(model) model.DateEnd, htmlAttributes:=New With {.class = "control-label col-md-2"})
                    <div class="col-md-10">
                        @Html.EditorFor(Function(model) model.DateEnd, New With {.htmlAttributes = New With {.class = "form-control"}})
                        @Html.ValidationMessageFor(Function(model) model.DateEnd, "", New With {.class = "text-danger"})
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(Function(model) model.Title, htmlAttributes:=New With {.class = "control-label col-md-2"})
                    <div class="col-md-10">
                        @Html.EditorFor(Function(model) model.Title, New With {.htmlAttributes = New With {.Class = "form-control datepicker"}})
                        @Html.ValidationMessageFor(Function(model) model.Title, "", New With {.class = "text-danger"})
                    </div>
                </div>

                <div class="form-group">
                    @Html.LabelFor(Function(model) model.Message, htmlAttributes:=New With {.class = "control-label col-md-2"})
                    <div class="col-md-10">
                        @Html.EditorFor(Function(model) model.Message, New With {.htmlAttributes = New With {.class = "form-control"}})
                        @Html.ValidationMessageFor(Function(model) model.Message, "", New With {.class = "text-danger"})
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <input type="submit" value="Create" class="btn btn-default" />
                    </div>
                </div>
            </div>
        End Using

尝试添加课程和样式

<div class="form-group">
                        @Html.LabelFor(Function(model) model.Message, htmlAttributes:=New With {.class = "control-label col-md-2"})
                        <div class="col-md-10">
                            @Html.EditorFor(Function(model) model.Message, New With {.htmlAttributes = New With {.class = "form-control newClass"}})
                            @Html.ValidationMessageFor(Function(model) model.Message, "", New With {.class = "text-danger"})
                        </div>
                    </div>

CSS

.newClass {
    min-height: 250px;
}

1 个答案:

答案 0 :(得分:0)

您可以创建一个新的CSS类并将其用于您的文本区域。

 @Html.EditorFor(Function(model) model.Message, 
             New With {.htmlAttributes = New With {.class = "form-control myFixedWidth"}})

和CSS

.myFixedWidth
{
  height: 250px;
  //Customize the way you want
}
如果您的媒体资源名称上有@Html.EditorFor文字装饰,

DataType.MultilineText将呈现文字区域。

Public Class RegisterEventVM

    <DataType(DataType.MultilineText)> _
    Public Property Name() As String
        Get
            Return m_Name
        End Get
        Set
            m_Name = Value
        End Set
    End Property
    Private m_Name As String

End Class

如果您不想使用此属性修饰viewmodel属性,可以使用Html.TextAreaFor辅助方法渲染文本区域。