开发者

HTML5/razor how to alter length of a input text box

开发者 https://www.devze.com 2023-04-02 13:37 出处:网络
Why has html5 changed so much stuff! How do i alter the width of the below two text boxes? <div class=\"editor-field\">

Why has html5 changed so much stuff!

How do i alter the width of the below two text boxes?

  <div class="editor-field">
          @Html.TextBoxFor(m => m.S1_LandLine)
          @Html.ValidationMessageFor(m => m.S1_LandLine)
  </div>

and

  <input type="text" id="myinput" value="1" class="Q" data-id2="Q" />

a开发者_如何学运维nd

<select id="S1_TitleID" name="S1_TitleID">
       <option selected="selected" value="1">Mr</option>
       <option value="2">Miss</option>
       <option value="3">Mrs</option>
</select>


Using CSS:

.editor-field input[type="text"], .editor-field select
{
  width:100px;
}


To generate the desired markup:

@Html.TextBoxFor(m => m.S1_LandLine, new { data_id2 = "Q", @class = "Q" })

As far as the length is concerned (whatever that means) you could use CSS to specify the Q rule => nothing really related to ASP.NET MVC nor HTML5.


What exactly did HTML5 change?! I am going to assume by length you mean the maxlength, or the number of characters you can input into the text box. I may be wrong but your question is a bit ambiguous.

For the first you can do:

<div class="editor-field">  
    @Html.TextBoxFor(m => m.S1_LandLine, new { maxlength = 10 })  
    @Html.ValidationMessageFor(m => m.S1_LandLine)  
</div>  

And the second:

<input type="text" id="myinput" value="1" class="Q" data-id2="Q" maxlength="10" />

If you are not looking the maxlength then what are you looking?

EDIT: Just noticed you say the width, if so follow others advice on here.


I know i am a little off topic, but if you're looking for maxlength attribute :

We are using the MVC pattern : your view should be strongly typed to your model.

View

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

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

And in the model, we can set defined conditions :

[Required]
[Range(1,10,ErrorMessage="Not in the 1-10 Range"]
public int Rating { get; set; }

[Required]
[StringLength(1024,ErrorMessage="Incorrect format")]
public string Body { get; set; }
0

精彩评论

暂无评论...
验证码 换一张
取 消