Check 10 top-level controls in the ASP. NET Ajax toolbox

Source: Internet
Author: User

By default ,. NET Framework only comes with the most basic Ajax controls, such as UpdatePanel and UpdateProgress. NET application Ajax, the simplest way is to use the extension control in the Ajax control toolbox, but Visual Studio does not include the Ajax toolbox by default, You need to download from here, you can add it to the Visual Studio toolbox in ASP. NET application. Note that this article is.. NET Framework 3.5, not 4.0.

1. AutoComplete)

This is my favorite ASP. the extension control of the NET TextBox Control. when you enter a character in the text box, it is displayed in the following list to allow users to select all valid values. The selected values are automatically filled in the TextBox Control, this control is used in many ASP.. NET applications. Figure 1 shows a simple example.



Figure 1 automatic control Running Effect

This control is used most frequently when providing the search function. It can provide users with search recommendations. The content in the drop-down list is exposed through a Web service.

2. Animation Scaling)

If you want to use ASP. NET Ajax to make a very fancy website, you should try the animation control, it can save a lot of time for developers to create an animation, it can be used as any ASP.. NET Control extension.

Animation extensions allow you to easily create effects such as fading, moving, resizing, and coloring. You can call these effects when the target control triggers the following events.

OnLoad

OnClick

OnMouseOver

OnMouseOut

OnHoverOver

OnHoverOut

Figure 2 shows the example animation effect when the target control in a DIV label is clicked.



Figure 2 animation control Running Effect

3. Colorpicker Extension)

It can be used as an extension control of the TextBox Control. When you click the TextBox Control, the color pick-up panel is displayed. You can select the color in this window, as shown in 3.



Figure 3 color pickup Control

Without this extension control, I don't know how difficult it will be to create such a control. This is also the reason why I listed it in the top 10 controls. I also admit that it is in ASP. this control is rarely used in. NET applications.

4. Modalpopup)

This is applicable to almost all ASP. NET Server container control extension, which allows you to smoothly display the Server Control, it allows you to write server code for the target control, but the client code is faster, the user experience is better, but it is always necessary to write the server code. This extension provides great convenience in this case.

This control makes the pop-up more smooth, refreshing, and rich user experience. Of course, you can also provide server code. Figure 4 shows a simple example.



Figure 4 modal pop-up control example


 

5. Foldable panel expansion (CollapsiblePanel)

When most of your web pages are composed of controls and text content, smart people will group them under different panels and extend them with a foldable panel at the top of the Group to increase the page's attention, this is an ASP. NET panel extension control, which is very useful and one of the most widely used extension controls, Figure 5 shows a simple example of foldable panel extension.



Figure 5 foldable panel example

6. Dynamic filling (Dynamic Populate)

This is a very useful and powerful extension control, which provides convenience for modifying the HTML content in the Ajax control. The HTML content modification of the control is controlled by TargetControlID, And the content filling is triggered by PopulateTriggerControlId, HTML content should be provided by Web Services.

This extension is useful when you create a dynamic web page. You do not need to load all content from the beginning, but display and hide the content according to the context. Dynamic Content is displayed only when necessary, therefore, the page size can be greatly reduced to improve the page performance.

7. Slide Show)

This extension is actually an ASP. NET image control allows you to easily create a slide playback effect. You need to use WebMethod to provide the images displayed by the slides. It provides the next page, previous page, the play/stop button and title label. Figure 6 shows a simple magic light display example.



Figure 6 extended Display Effect of a magic lamp

 8. Tab controls (Tabs)

Strictly speaking, it cannot be counted as an extension, because tabs are an independent control during ASP development. NET web pages, the most headache for me is to create tabs, must be combined with JavaScript and HTML, the advantage of tabs is to make the page more beautiful, make the navigation more smooth, allow.. NET developers group projects according to certain logic. The tab control with TabContainer is a container that can contain multiple TabPanels, that is, sub tabs, figure 7 shows a simple tab example.



Figure 7 tab control example

9. HTML Editor controls (HTML Editor)

Like the tab control, the HTML editor is also an independent control that provides end users with rich HTML text editing functions, the HTML editor you see on the webpage is very powerful.

You can use the HTML editor to edit articles or comments by visitors in the background. Of course, you can restrict submitted content. For example, the content in full HTML format is usually used in background editing, comments can only be plain text content. Figure 8 shows a simple HTML editor example.



Figure 8 HTML editor controls

10. ListSearch)

This extension can be a list box control or a drop-down list control. You can enter letters to search for the content in the list box or drop-down list, figure 9 shows a simple list search extension example.



Figure 9 List Search Extension

Summary

There is no doubt that the extension of the Ajax control toolbox makes our ASP. NET Web applications become more colorful and provide a better user experience. CSS and animation in all Ajax control toolbox extensions can be customized. That is to say, you can carry forward the Hack spirit, the ultimate page effect and user experience.

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.