ASP를 렌더링합니다.HTML5 형식의 NET 텍스트 상자 입력 유형 "번호"

ASP를 렌더링합니다.HTML5 형식의 NET 텍스트 상자 입력 유형 "번호"

ASP일 때.NET TextBox는 다음을 렌더링합니다.

<input type="text" />

하지만 HTML5 번호 유형으로 렌더링하려면 다음과 같이 필요합니다.

<input type="number" />

이것이 가능합니까?

저는 ASP를 사용하는 모바일 웹사이트에 대한 동일한 요구사항을 가지고 있었습니다.NET. 좋은 해결책을 찾지 못한 후, 저는 간단히 설정하려고 했습니다.type="number"텍스트 상자에 직접 표시됩니다.놀랍게도, 효과가 있었습니다!믿을 수 없어요, 저는 두 번 확인하기 위해 간단한 테스트 프로젝트를 만들었습니다.이 코드 라인을 각각 실행했습니다.NET 버전:

<!-- this HTML tested in each .NET version -->
<asp:TextBox runat="server" type="number" />

결과는 다음과 같습니다.

<!-- ASP.NET 2.0, 3.0, and 3.5 -->
<input name="ctl01" type="text" type="number" />

<!-- ASP.NET 4.0 and 4.5 -->
<input name="ctl01" type="number" />

결론: ASP를 사용하는 경우.NET 4.0 이상, 추가만 가능type="number"텍스트 상자로 이동합니다.

그 재산은 그것을 위해 사용됩니다. 예를 들어,

<asp:TextBox ID="uPhone" CssClass="formEntry" TextMode="Phone" ClientIDMode="Static" runat="server"></asp:TextBox>

로 해석될 수도 있습니다.

<input name="ctl00$ContentPlaceHolder1$uPhone" id="uPhone" class="formEntry" type="tel">

[MultiLine | Password | SingleLine] 이외의 텍스트 모드는 VS2010 이후에 도입되었습니다. 문서에서는 정확한 시기를 빠르게 알려주지 않습니다.

기본 텍스트 상자 컨트롤 재정의

public class HTML5TextBox : TextBox
{
.....
protected override void Render(HtmlTextWriter writer)
{
//Sth like the code below, you need do some research though
 writer.AddAttribute(HtmlTextWriterAttribute.Type,"Number");
 writer.AddAttribute(HtmlTextWriterAttribute.Id, ClientID + "_displayTXT");
 writer.AddAttribute(HtmlTextWriterAttribute.Name,this.UniqueID + "t1");
 writer.AddAttribute(HtmlTextWriterAttribute.Value,base.Text);
 writer.RenderBeginTag(HtmlTextWriterTag.Input);       
 writer.RenderEndTag(); 
}
....
}

아니면 제가 방금 찾은 것을 http://www.codeproject.com/Articles/68834/Enhanced-Textbox-Control 에서 확인하실 수 있습니다.

Enum TextBoxMode의 멤버를 사용할 수 있습니다.

<asp:TextBox ID="MyAwesomeId" runat="server" TextMode="Number"></asp:TextBox>

이 렌더

<input type="number" value="5" id="MainContent_MyAwesomeId" c>

전체 열거형

public enum TextBoxMode
{
    SingleLine = 0,
    MultiLine = 1,
    Password = 2,
    Color = 3,
    Date = 4,
    DateTime = 5,
    DateTimeLocal = 6,
    Email = 7,
    Month = 8
    Number = 9,
    Range = 10,
    Search = 11,
    Phone = 12,
    Time = 13,
    Url = 14,
    Week = 15
}

다음과 같이 동적으로 생성된 컨트롤을 사용하여 이 작업을 수행할 수 있었습니다.

TextBox control = new TextBox();
control.Attributes.Add("Type", "number");

다음을 상속하는 새 컨트롤을 생성해야 합니다.TextBox렌더링을 재정의하거나 Javascript 스니펫을 생성하여 사실 이후에 변경할 수 있습니다.

세트type="number"에<asp:textbox type="number" runat="server">그것과 상관없이, 그것은 목록에 나타나지 않고, 놀랍게도 작동할 것입니다.

언급URL : https://stackoverflow.com/questions/9398356/render-asp-net-textbox-as-html5-input-type-number