Asp.net 2.0 tutorial other server controls

Respect the author. Keep the words www.it55.com.

Today we have a little more content. We need to learn about the remaining six server controls in Asp.net 2.0, so we will start now.

1. bulletedlist Control
Purpose: Display small-scale list display, which is output in UL Li or ol Li mode. list items can appear in the form of text, link, and linkbutton.
Creation method:
Create a web form document and change it to the design interface. Drag and Drop the bulletedlist control in the "standard" option bar on the left-side toolbar to the page.
Add list items through "Edit items:

The running effect is as follows:

The left side of each list item uses solid Dots as the line header, which can be changed by changing the bulletstyle attribute of bulletedlist.

Note that, if the list items of your bulletedlist control are manually added and dynamically bound to the background, you must set the appenddatabounditems attribute to true.

2. hiddenfield Control
Function: stores hidden data in the value attribute, similar to <input type = "hidden"/> in HTML, except that the control runs on the server; it is suitable for parameter transmission with low security requirements.
Creation Method: drag and drop the hiddenfield control in the "standard" option bar on the left-side toolbar to the page and assign values to it through its property page. Of course, you can also assign values through the client script. In the background program, you can obtain and set the value and perform corresponding judgment.

3. fileupload Control
Purpose: upload a file.
Create method: drag and drop the fileupload control in the "standard" option bar on the left-side toolbar to the page. The effect is as follows:

You need to add a button to submit the upload event and change the text attribute of the button to "Upload". The result is as follows:

Double-click the upload button to go To the CS file in the background of the page, and change the click event processing function of the button to the following:

Protected void button#click (Object sender, eventargs e) // button1 is the ID attribute value of the button "Upload"
{
String Path = server. mappath ("./"); // obtain the absolute address of the current directory on the server as the image storage address.
If (fileupload1.hasfile) // determines whether the local file to be uploaded has been selected
{
String fileext = system. Io. Path. getextension (fileupload1.filename). tolower (); // get the extension of the uploaded file and convert it to lowercase letters to prepare for determining the validity of the following upload types
If (fileext = ". GIF" | fileext = ". jpg") // upload only. gif and. jpg files are allowed.
{
// Start the upload operation
Try
{
Fileupload1.saveas (path + fileupload1.filename); // The server saves the file
Response. Write ("the file is uploaded successfully! ");
}
Catch (exception ex)
{
Response. Write ("an error occurred during file upload. error message:" + ex. Message );
}
}
Else
{
Response. Write ("the program only supports uploading. GIF or. jpg files! ");
}
}
Else // if no local file is selected
Response. Write ("select a file first! ");
}

So far, a simple file upload function has been completed. Note:
The fileupload control has a postedfile attribute that can be used to obtain the httppostedfile object related to the uploaded file. You can use this attribute to obtain the path, size, file type, and other attributes of the uploaded file, such:
In the preceding example, you can use fileupload1.postedfile. contentlength to obtain the size of the uploaded file.

4. Imagemap Control
Purpose: Create image navigation. Create a hot zone and link in one or more areas of the image to create a navigation.
Create method: drag and drop the Imagemap control in the "standard" option bar on the left-side toolbar to the page, and add an image to the image by modifying its imageurl attribute (the image must be added to the website project through "add existing items" in advance ):

Then, create one or more hot zones for them through the hotspots attribute:

As for the location of Heat Zone coordinates, it is a major omission of vs. We must use an image processing tool to obtain the coordinates and sizes of the pre-heat zone in the image, and then we can smoothly create a heat zone in. This is far behind DW.
It should be noted that the background program can obtain the user's Click location based on the Click Event and postbackvalue attribute of the Imagemap control.

5. multiview and View Controls
Function: functions similar to Windows tabs can be implemented. Multiview is a control container that stores one or more View Controls.
Creation method:
Let's make a simple multiview of two view controls.
We first add two buttons to trigger the switching between the two view controls, respectively, modify the text attribute to "Tab 1", "Tab 2", and then press enter to wrap the line. Drag and Drop the multiview control in the "standard" option bar on the left-side toolbar to the page. The effect is as follows: # P # page title # e #

Drag and Drop the View Control in the "standard" option bar on the left-side toolbar to the page multiview control, and place two View Controls (drag and drop twice ), then, enter the corresponding content in the two view controls. The result is shown in the following figure:

Click the multiview control and change the value of the activeviewindex attribute to 0. That is, the first view control is selected and activated by default. (If it is 1, the second view control is selected for activation)

Next, we will trigger the switch of the View control. Double-click "Tab 1" to go To the CS file in the background, and change the click function as follows:

Protected void button#click (Object sender, eventargs e) // button1 is the ID attribute value of the button "Tab 1"
{
Multiview1.activeviewindex = 0; // activeviewindex attribute: used to obtain or set the index value of the currently activated view control.
}

Double-click "Tab 2" to go To the CS file in the background and change its click function as follows:

Protected void button2_click (Object sender, eventargs e) // button2 is the ID attribute value of the button "Tab 2"
{
Multiview1.activeviewindex = 1;
}

After running, when we click the "Tab 1" button, the content of the view1 control is displayed. When we click "Tab 2", the content of the view2 control is displayed.
If we modify the content and use CSS to modify it, we can fully implement the "my computer" attribute tab function of Windows:

6. Wizard Control
Purpose: implement the operation wizard function. For example, "Installation Wizard", "Registration Wizard", and "step-by-step investigation.
Create method: drag and drop the wizard control in the "standard" option bar on the left-side toolbar to the page. In the wizard task, click "Add Remove wizardsteps ":

In the wizardstep Set Editor, add the wizardstep, modify the title attribute value, and Id attribute value. When the number of wizardsteps meets your requirements, click "OK" in the lower right corner.
In the design view, click Step 1 (in this example, "User Name"), and then click the right half of the wizard control to edit the content of Step 1:

Then edit Step 2:

...

In the last step, the "finish" button appears in the Wizard. Double-click the "finish" button to go To the backend CS file and process the user registration information (such as writing the information to the database ).
In this example, the effect is as follows:

The source code of this example is attached:
Upload/2007_05/07050816266783.rar

How time fly ~
Tomorrow we will be connected to the essence of the Asp.net 2.0 website construction: Data Source Control sqldatasource control and accessdatasource Control