Html.TextAreaFor in asp.net mvc

Question

I have a asp.net mvc view that allows the user to enter some description in a textarea.

There are two problems that I am facing.

Either when I expand the textarea it is expanding without moving other html elements or I am not able to make create a Html.TextBoxFor () multiline textbox. Can anyone suggest a solution to this? If Use Textarea how to make it expand(grow in size) so that it does not overlap with other elements or how to use Html.TextBoxFor() for multiline?

This is how my code looks like

<% using (Html.BeginForm())
        { %>
     <%: Html.ValidationSummary(true)%>

    <fieldset>

        <div class="editor-label1">
            <%: Html.LabelFor(Model => Model.PackageID)%>
        </div>
        <div class ="editor-field1">
             <%: Html.HiddenFor(Model => Model.PackageID)%>
              <%: Html.DisplayFor(Model => Model.PackageID)%>
             <%: Html.ValidationMessageFor(Model => Model.PackageID)%>
        </div>

         <div class="editor-label1">
            <%: Html.LabelFor(Model => Model.PackageName)%>
        </div>
        <div class ="editor-field1">
            <%: Html.TextBoxFor(Model => Model.PackageName)%>
            <%: Html.ValidationMessageFor(Model => Model.PackageName)%>
        </div>

        <div class="editor-label1">
            <%: Html.LabelFor(Model => Model.PackageDesc)%>
        </div>
        <div class ="editor-field1" style= "padding-bottom: 50px; margin-bottom: 150px">
            <%: Html.TextBoxFor(Model => Model.PackageDesc, new { TextMode = TextBoxMode.MultiLine, cols = "55", rows = "10" })%>

            <%: Html.ValidationMessageFor(Model => Model.PackageDesc)%>
        </div>

         <div class="editor-label1">
            <%: Html.LabelFor(Model => Model.PackageTitle)%>
        </div>
        <div class ="editor-field1">
            <%: Html.TextBoxFor(Model => Model.PackageTitle)%>
            <%: Html.ValidationMessageFor(Model => Model.PackageTitle)%>
        </div>
        <div class ="editor-label">
            <%: Html.Label("Project ID") %>
        </div>
        <div class="editor-field">
            <%:Html.DropDownList("ProjectID", (IEnumerable<SelectListItem>)ViewData["projects"])%>
        </div>
         <div>
                <input type="submit" value="Save Edit" />
         </div>
    </fieldset>
    <% } %>

GleDel · Accepted Answer · 2014-11-23 17:08:50Z

29

Use the code below when using Razor

   @Html.TextAreaFor(model => model.Comments, 10, 40, null);

answered Nov 23, 2014 at 17:08

GleDel

4715 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:47:13Z

27

Rendering TextArea using ASP.NET MVC's Html helper and making it resizable are two different concerns. When using Html helper you can add a class to textarea like

<%:Html.TextAreaFor(x => x.SomeProperty, new { @class = "resizer" }) %>

Then you can hook this class with jQuery to make it resizable when it's rendered on the web page. Please refer to Implementing a resizable textarea? for information about making your textarea resizable.

edited May 23, 2017 at 11:47

CommunityBot

11 silver badge

answered May 5, 2011 at 6:31

Muhammad Adeel Zahid

17.8k16 gold badges95 silver badges160 bronze badges

Comments

Zarko Eeternal · Accepted Answer · 2017-12-11 12:12:10Z

1

Even better, if you want auto-calculate number of the rows in the textarea you can use this

@Html.TextAreaFor(m => m.Comments, Model.Comments.Count + 1, 40, null)

answered Dec 11, 2017 at 12:12

Zarko Eeternal

5374 silver badges11 bronze badges

Collectives™ on Stack Overflow

Html.TextAreaFor in asp.net mvc

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related