Search code examples
c#jqueryasp.net-mvcvisual-studio-2012html-helper

How to change the height for Html.EditFor in Asp.net mvc.I've tried using jQuery .But failed


I've been working on asp.net mvc.I ran into a problem.I have a textbox which is multiline.I want to increase it's height.I've tried using @html.raw method and also tried to add inline style using new{styles:} in Html.EditFor.Nothing worked.So,How can I do that ?Here is my View

   @model CTCFremont.Models.eMail

@{
    ViewBag.Title = "Create";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>
    $(document).ready(function () {

        $("#PrayerRequest").css("height", 300);
        $("#PrayerRequest").css("width", 200);

    });
</script>
<h2>Submit Your Prayer Request</h2>

@using (Html.BeginForm()) {
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>eMail</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Name)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Email)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Email)
            @Html.ValidationMessageFor(model => model.Email)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Request)
        </div>
        <div class="editor-field"  >
            @Html.EditorFor(model => model.Request,Html.Id("PrayerRequest"))
            @Html.ValidationMessageFor(model => model.Request)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

Let me know how to deal with this..


Solution

  • Not sure which editor you want to use a textarea for, but just use code like the following to specify a height in CSS styles.

    @Html.TextAreaFor(x => x.Request, new {@style = "height: 30px;"})