56

I'm looking to create a Bootstrap styled textbox, specifically, based on the exact example below:

<input class="span3" type="email" required>

Here's what I have so far:

@Html.TextBox("CustomerEmail", null, new { @class = "input-xlarge", type = "email", required = "required" })

However, required = "required" clearly doesn't return just required.

So, my question is, is there any way I can force it to return required like in the first example above when using Html.Textbox?

3

4 Answers 4

82

i think you should use like this

 @Html.TextBoxFor(model => model.Name, new { @class = "text", type = "email", required = "required" })

i think this will help you.

1
  • How did this answer the question? Does this not render required="required" ? Personally, Im working on accessibility problems and even though required="required" is valid syntax, for screen readers I'm under the impression it is best to have required by itself. May 24, 2021 at 14:14
20

Try

new { required = string.Empty}

As an aside, according to the W3C docs, required is a Boolean attribute, and I quote:

The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value. If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.

Therefore

required
required="required"
required=""

all mean the same thing.

2

You seem to have applied a different class to the textbox: input-xlarge, whereas in your desired markup it's called span3.

So:

@Html.TextBox(
    "CustomerEmail", 
    null, 
    new { 
        @class = "span3", 
        type = "email", 
        required = "required" 
    }
)

As far as the required part is concerned, the correct syntax here is required="required", otherwise you simply get broken HTML.

5
  • I know this. The example I provided from my code contains the class I wish to use and is therefore correct and that wasn't my question. In addition to this, required can be set in a number of ways though i am looking to replicate the way it has been set in the Bootstrap documentation to see if it yields the same result.
    – LiamGu
    Jan 11, 2013 at 11:55
  • This helper will generate semantically identical code to what you have shown as desired output. So I guess what you have shown as desired markup is not that much desired as it doesn't work quite well. Anyway this has strictly nothing to do with ASP.NET MVC. I guess you have some problem with the styles, ... Jan 11, 2013 at 11:55
  • No, I have referred merely to the "required" portion of the example I provided as the attribute is the desired output.
    – LiamGu
    Jan 11, 2013 at 11:57
  • required and required="required" are strictly identical, except that the first is incorrect and broken HTML but client browsers understand it. Anyway you simply cannot force an HTML helper such as TextBox to generate broken HTML. It's not how HTML helpers were designed. If you want to generated broken HTML you will have to do it by hand or write a custom HTML helper. I am afraid that ASP.NET MVC cannot help you here. Jan 11, 2013 at 12:02
  • 2
    Again, the first is not incorrect nor broken, it is the latter that is incorrect. The presence alone of boolean attribute in the HTML5 specification means true, while the absence of the attribute means false. w3.org/html/wg/drafts/html/master/… Nov 5, 2013 at 15:34
1

I noticed that you can also use.

required="true"

The interesting thing is that you get a warning message in Visual Studio 2015 regardless. I wonder if this is a problem with a need for updating.

Warning Message:

Severity    Code    Description Project File    Line    Suppression State
Message     Validation (ASP.Net): Attribute 'required' is not a valid attribute of element 'TextBox'.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.