ASP. NET 3.5 core programming learning notes (5): HTML controls

Source: Internet
Author: User

Code snippet:

<Input runat = "server" id = "lastname" type = "text" value = "test"/>

After processing by the ASP. NET Runtime Library, the preceding statement generates the following HTML code:

<Input name = "myname" id = "myname" type = "text" value = "text"/>

Note: The server ID attribute is expanded into two HTML attributes: Name and ID. This is considering the compatibility of browsers. However, on the server side, the control Instance name is only specified by the ID. If both name and ID are specified in a server tag, the value of name is automatically rewritten to the value of ID.

Common HTML controls

All predefined HTML server controls inherit from the same base class-system. Web. UI. htmlcontrols. htmlcontrol. Most HTML tags have direct classes in. NET Framework. A few custom labels (such as <IFRAME>, <HR>, <font>, and <body>) are presented through the htmlgenericcontrol class and generalized attributes) set, but no direct property ).

Basic class htmlcontrol

The htmlcontrol class inherits from the control class. The following table lists the properties unique to HTML controls.

The disabled HTML server control is still visible and always output in the form of HTML code. If its visible attribute is set to false, no HTML Tag is generated for the control.

The disabled attribute of HTML only acts on the input control in HTML, and does not affect tags such as anchor.

Use of HTML attributes

The property of each HTML control corresponds to the attribute of the HTML control. the value assigned to the property is reflected in the HTML output. For controls that do not directly correspond to tags in HTML, the attributes set is used to set the final attribute of the HTML Tag ). This set is also used to set attributes that cannot be directly set through the control interface. You can also customize HTML attributes if needed. The content of the attributes set is processed by strings. Sample Code:

<script>
function Init()
{
alert("Hello");
}
</script>

<script runat="server" language="C#">
void Page_Load(object sender, EventArgs e)
{
theBody.Attributes["onload"] = "Init()";
}

<body runat="server" id="theBody"></body>

The attributes attribute is a special type-attributecollection class. Although it is called a set, its content cannot be iterated directly through the for... each statement, because it does not support the ienumerable interface. This class provides several special methods to generate attributes using text writer objects and add or remove elements. Interestingly, if the attribute named style is added, the class automatically redirects its content to the style set.

Inheritance level of HTML controls

Most HTML controls fall into two categories: container controls and input controls. The HTML Control tree hierarchy is provided:

HTML Container Control

The base class of the Container Control is htmlcontainercontrol. The HTML elements of such labels must carry the end label. Compared with the htmlcontrol class, the Container Control has two attributes: innerhtml and innertext. These two attributes are used to read/write the text content between the start tag and the end tag of the current element, and the tag itself will not be output. Note: If a control contains a server control, the internal content of the control cannot be obtained. Innertext gets or sets the TAG content in plain text, while innerhtml gets or sets the same content, but the format is HTML.

The following table lists the container controls defined in ASP. NET:

Unlike htmlbutton, The htmlinputbutton control represents the button variation of the <input> label. The htmlbutton control represents the <button> label in the HTML 4.0 standard.

Server-side forms play a key role in ASP. NET applications, because they are a means to achieve sending back and ensure State maintenance. For this reason, the htmlform control is not just a form element that can be programmed on the server side. The hidden Action attributes of htmlform cannot be shipped to another page that is different from the HTML content generated by the browser.

Header Information Management

The htmlhead control is automatically created when the

The header attribute introduced by the page class can return the page header. If the

The htmlhead control implements the ipageheader interface, which consists of three set attributes (metadata, linkedstylesheet, and stylesheet) and one string attribute title. The metadata attribute is a dictionary used to collect all <meta> sub-tags in the header.

Code: header. Metadata. Add ("code-language", "C #");

Converted to tag: <meta name = "code-language" content = "C #"/>

To express other commonly used metadata, you can use the newly added htmlmeta control, as shown in the following example:

void Page_Init(object sender, EventArgs e)
{
HtmlMeta meta = new HtmlMeta();
meta.HttpEquiv = "refresh";
meta.Content = "10";
((Control)Header).Controls.Add(meta);
}

The above code dynamically creates a meta tag and adds it to the header segment of the page during initialization. As long as the existing meta tag has the runat attribute, We can manipulate it programmatically.

Note: The header attribute must be explicitly converted to the control type, because the header attribute is declared as the ipageheader type.

Navigate to a specific URL

The htmlanchor class can access and configure the <A> label programmatically.

The href attribute of this class is used to set the hyperlink target and navigate to a specific location.

The name attribute is used to name the segment of the ASP. NET page. In this way, you can use hrefs with the # prefix to access the segment from any location on the same page.

The following code defines a bookmarks anchor named moreinfo:

<A name = "moreinfo">

You can use the following hyperlink to locate the anchor:

<A href = "# moreinfo"> get more info </a>

The target attribute is used to identify the target window or frame that loads the linked URL. Generally, the target value is _ Self, _ top, _ blank, and _ parent. It can also be a reference name for a framework specific to other pages. This function relies heavily on browsers.

The title attribute specifies the text displayed when you hover your mouse over the anchor area.

In addition to navigating to another page, the htmlanchor control can also send the page back through the serverclick event. Sample Code:

<A runat = "server" onclick = "run ()" onserverclick = "dosomething"> click </a>

The onclick attribute defines client Event Handlers written in Javascript, while the onserverclick attribute points to a piece of server code.

Htmlselect Control

The htmlselect control is a list of options. One or more options are available.

The size attribute defines the number of rows displayed in the control.

The Multiple Attribute specifies whether the control can be selected multiple times.

Internally, each option is organized in the items collection, and each element represents a listitem object. Listitem is not defined in the htmlcontrols namespace, but is located in the webcontrols namespace.

By default, the htmlselect control is displayed as a drop-down list. If you allow multiple selections or the number of rows is greater than 1, the control is displayed as a list box.

The datasource attribute is used to set the data source. It can be any. Net object that implements the ienumerable interface. If a data source (such as a DataSet object) contains multiple tables that can be bound, you can use the datamember attribute to select one of the tables. Datatextfield and datavaluefield are used to bind the text and value attributes of the list item to the corresponding column of the data source respectively.

Htmltextarea Control

The HTML element corresponding to the htmltextarea control is <textarea>.

The Rows and Cols attributes specify the number of rows and columns in the text box.

The Value Attribute adds text to the display area of the control.

Serverchange event: When the page is sent back, this event is triggered if the content in the control text box is changed.

This control implements the ipostbackdatahandler interface. You can use the raisepostdatachangedevent method to override this interface to trigger custom events.

To determine whether a serverchange event occurs, you must track the text content of the two rounds of sending. This information is stored in the view State. If the view status of the host page or control is disabled, the serverchange event will not be triggered.

HTML input control

All input control classes are derived from the htmlinputcontrol class. This class is an abstract class that defines the public programming interfaces required by all input controls.

The Name property returns the name of the Control. Although this property is marked as readable/written, it actually serves as only a read-only property. The get accessors return the uniqueid attribute of the control. The set accessors are empty.

The Type attribute reflects the type attribute of the HTML input element, which is read-only.

The value attribute is a read/write attribute that represents the content of the input field.

Htmlinputbutton Control

Serverclick event: events triggered on the server after the button is clicked.

This control automatically adds the script code for sending back in The onclick attribute of HTML. In this way, any click operation will send the page back and execute the corresponding code.

Example:

<Input runat = "server" type = "button" id = "BTN" value = "click" onserverclick = "btnclicked"/>

The corresponding HTML code is:

<Input language = "JavaScript" onclick = "_ dopostback ('btn ','') "name =" BTN "type =" button "value =" click "/>

The _ dopostback script function is a standard code generated by ASP. NET to implement sending back. If the button type is set to submit (which always causes sending back), no client script is generated or The onclick attribute is set.

In ASP. NET 2.0 and later versions, htmlinputsubmit and htmlinputreset controls are added to generate the submit and reset buttons.

Causesvalidation attribute: boolean type, indicating whether to verify the input field after the button is clicked. The default value is true. If no verification is required, you can set it to false to disable it.

Htmlinputfile Control

This control is a file upload tool. To use this control, make sure that the enctype attribute of the server form is multipart/form-data. However, since ASP. NET 2.0, enctype is automatically set before the htmlinputfile control is rendered as a tag.

On the server side, the file will be carried by the httppostedfile type object.

Sample Code:

<%@ Page Language=”C#” %>
<%@ Import Namespace=”System.IO” %>
<script runat=”server”>
void UploadButton_Click(object sender, EventArgs e)
{
if(FileUpload1.PostedFile != null)
{
FileUpload1.PostedFile.SaveAs(@”C:\tmp\” + Path.GetFileName(FileUpload1.Value);
}
}
</script>
<title>File Upload</title>
<body>
<form runat=”server”>
<input type=”file” id=”FileUpload1” runat=”server” />
<input runat=”server” id=”UploadButton” type=”submit” value=”Upload” onserverclick=”UploadButton_Click” />
</form>
</body>

You can use the inputstream attribute of the httppostedfile object to save or process the data to be read.

The accept attribute of the httpinputfile control limits the types of uploaded files.

When using the saveas method, you must specify the complete path of the output file. In addition, the account used by ASP. NET should have write permission on the directory of the files to be stored.

ASP. NET limits the data size of a single upload. The maxrequestlength attribute of the

Htmlimage Control

The htmlimage class corresponds to the tag. The htmlimage instance is created only when the page contains the label with the runat attribute set.

You can use this control to control an image using a programming file, change its source file, width/height, or align it with other elements on the page.

Literal control

The literal control is a special type of server control. ASP. NET creates and uses it only when it is plain text that does not need to be processed by the server. In general, everything that appears in the context of an ASP. NET page is regarded as a control. If a tag contains the runat = "server" attribute, ASP. NET creates an instance of a specific class. If the runat attribute is not specified, the text is compiled as a literalcontrol object. The literal control is a simple text storage. It can be added to or removed from the page through the consistent programming interface defined by other server controls.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.