70264

Disable cols with TextAreaFor

Question:

OK I am using MVC 4 with Bootstrap and running into a problem with TextAreaFor and columns. By default if you don't set the col/row the system sticks 2/10 as the default. Obviously if you enter the row/col it will use that. The problem is with forms using Bootstraper it is better if you just leave it blank. Anyone come up with a good way of disabling col for TextAreaFor.

@Html.TextAreaFor(m=> m.Comments, new { htmlAttributes = new { @class = "form-control" } })

outputs:

<textarea cols="20" htmlAttributes="{ class = form-control }" id="Comments" name="Comments" rows="2"></textarea>

but I want this:

<textarea htmlAttributes="{ class = form-control }" id="Comments" name="Comments" rows="2"></textarea>

This of course works but not friendly:

<textarea id="Comments" name="Comments" rows="10" class="form-control">@Model.Comments</textarea> <hr />

Edited -- Oh well I created a custom editor template as such:

@{ string id = ViewData.ModelMetadata.PropertyName; string rows = string.Empty; if (ViewData["rows"] != null) { rows = string.Format("rows={0}", ViewData["rows"]); } } <textarea id="@id" name="@id" @rows class="form-control">@Model</textarea>

Usage:

@Html.EditorFor(model => model.Comments, "TextAreaCustom", new { @rows = 10 })

Answer1:

Unfortunately, no, you can't turn off an attribute that the helper adds by default; you can only change its value. This is mostly due to the fact that you can't set null items in an anonymous object, i.e. passing something like the following for htmlAttributes would raise an exception:

new { cols = null }

The only thing you can do, is leave it out of the anonymous object, but then the default takes over. One thing you can try is doing:

new { cols = "" }

Which should result in the generated HTML of

<textarea cols="" ...>

Not sure if that will actually work though; you'll have to test it. However, I'm using Bootstrap in my projects and I've never had to disable the cols attribute: it just works. What problem are you experiencing exactly with Bootstrap, because maybe that's something that <em>can</em> be fixed.

Answer2:

For what it's worth, in the latest version of MVC (and maybe previous versions) you can set the col and rows to 0 and it won't render in the html.

This:

@Html.TextAreaFor(m => m.Comments, 0, 0, new { @class="form-control" })

Produces this:

<textarea class="form-control" id="Comments" name="Comments"></textarea>

Answer3:

There are rows and column attributes that you can set for TextAreaFor and it looks like by default it adds cols=20 and rows=2. Perhaps you can specify exactly what you want. Something like this for instance.

@Html.TextAreaFor(m => m.Commnets, new { @class = "whatever-class", @cols = 10 })

Answer4:

Unfortunately there is no simple fix for this (unless you can consider JavaScript DOM manipulation)... you need to create your own HtmlHelper classes to use in your views...

Add the following class to your MVC project, and to use it... your views you can simply write @this.Html.TextAreaHelperFor(...) and use it the exact same way that you would use the TextAreaFor method, except the output wont be including any col or row attributes

<hr />using System; using System.Collections.Generic; using System.Linq.Expressions; using System.Web; using global::System.Web.Mvc; public static class TextAreaHelperExtension { public static MvcHtmlString TextAreaHelperFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression) { return TextAreaHelperFor(htmlHelper, expression, null); } public static MvcHtmlString TextAreaHelperFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object htmlAttributes) { return TextAreaHelperFor(htmlHelper, expression, HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)); } public static MvcHtmlString TextAreaHelperFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, IDictionary<string, object> htmlAttributes) { if (expression == null) { throw new ArgumentNullException("expression"); } return TextAreaHelper(htmlHelper, ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData), ExpressionHelper.GetExpressionText(expression), htmlAttributes); } internal static MvcHtmlString TextAreaHelper(HtmlHelper htmlHelper, ModelMetadata modelMetadata, string name, IDictionary<string, object> htmlAttributes, string innerHtmlPrefix = null) { string fullName = htmlHelper.ViewContext.ViewData.TemplateInfo.GetFullHtmlFieldName(name); if (String.IsNullOrEmpty(fullName)) { throw new ArgumentException(); } TagBuilder tagBuilder = new TagBuilder("textarea"); tagBuilder.GenerateId(fullName); tagBuilder.MergeAttributes(htmlAttributes, true); tagBuilder.MergeAttribute("name", fullName, true); ModelState modelState; if (htmlHelper.ViewData.ModelState.TryGetValue(fullName, out modelState) && modelState.Errors.Count > 0) { tagBuilder.AddCssClass(HtmlHelper.ValidationInputCssClassName); } tagBuilder.MergeAttributes(htmlHelper.GetUnobtrusiveValidationAttributes(name, modelMetadata)); string value; if (modelState != null && modelState.Value != null) { value = modelState.Value.AttemptedValue; } else if (modelMetadata.Model != null) { value = modelMetadata.Model.ToString(); } else { value = String.Empty; } tagBuilder.InnerHtml = (innerHtmlPrefix ?? Environment.NewLine) + HttpUtility.HtmlEncode(value); return tagBuilder.ToMvcHtmlString(TagRenderMode.Normal); } internal static MvcHtmlString ToMvcHtmlString(this TagBuilder tagBuilder, TagRenderMode renderMode) { return new MvcHtmlString(tagBuilder.ToString(renderMode)); } }

Recommend

  • Symfony2 plaintext users don't work
  • Read a file in “chunks” using PHP
  • Removing event listeners on automatically created multiple elements
  • Is it safe to accept URL parameters for populating the `url_for` method?
  • How to synchronize two scrollview in Android?
  • How do I check if System::Collections:ArrayList is empty / nullptr / null?
  • Creating a C++ function that calls other Lua function
  • Get a trait object reference from a vector
  • select function not working in 3.5.4 version of d3.js
  • JavaScript IE rotation transform maths
  • C# - Most efficient way to iterate through multiple arrays/list
  • Consuming a WCF service in a Java Client using wsHttpBinding
  • How to use function wrapper in mustache.php?
  • Ember.js model to be organised as a tree structure
  • Element.tagName for python not working
  • ListItem.Attributes.Add not working
  • How does document.ready work with angular element directives?
  • Odoo 10 - Overriding unlink method
  • WPF - CanExecute dosn't fire when raising Commands from a UserControl
  • Paperclip, set path outside of rails root folder
  • What is the “return” in scheme?
  • javascript inside java/jsp code
  • Statically linking a C++ library to a C# process using CLI or any other way
  • Calling of Constructors in a Java
  • AT Commands to Send SMS not working in Windows 8.1
  • php design question - will a Helper help here?
  • Traverse Array and Display in markup
  • Transpose CSV data with awk (pivot transformation)
  • SetUp method failed while running tests from teamcity
  • Android Studio and gradle
  • Rails 2: use form_for to build a form covering multiple objects of the same class
  • Why can't I rebase on to an ancestor of source changesets if on a different branch?
  • What are the advantages and disadvantages of reading an entire file into a single String as opposed
  • How do I configure my settings file to work with unit tests?
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • Is it possible to post an object from jquery to bottle.py?
  • How to get NHibernate ISession to cache entity not retrieved by primary key
  • How can i traverse a binary tree from right to left in java?
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How do I use LINQ to get all the Items that have a particular SubItem?