Ajax controltoolkit-Accordion 1

Source: Internet
Author: User

 

1. Introduction to accordion controls
The accordion control is a web control that provides multiple display panel versions. It can only display the content of one panel at a time. It has multiple foldable panel versions and can only expand one panel at a time. The panes contained in accordion is the list of accordionpane controls. Each accordionpane control has a template with a title and content.
The accordion control has three autosize modes to adapt to different la s:
None: the accordion control is unrestricted when it is expanded or shrunk, which causes other elements to move up or down in the page.
Limit: When the accordion control is expanded, it cannot exceed the height set at the beginning of the control. If there are too many items displayed, a scroll bar will appear.
Fill: the accordion Control always keeps the same size as the height setting.
The accordion control can also bind data, specify a data source through the datasource or performanceid attribute, and set the header data field (headertemplate) and content data field (contenttemplate ).

encoding = "accordionheader" encoding = "encoding"
contentcssclass = "accordioncontent" fadetransitions =" false "framespersecond =" 40 "
transitionduration =" 250 "autosize =" NONE "requireopenedpane =" false "suppressheaderpostbacks =" true ">

Selectedindex: Index Number of the expanded accordionpane control.
Headercssclass: Specifies the title CSS class name. You can also specify the headercssclass attribute of the accordion control as the default attribute of all accordionpanes controls, or directly specify the headercssclass attribute of the accordionpane control.
Contentcssclass: the CSS class name used to display the content. You can also specify the contentcssclass attribute of the accordion control as the default attribute of all accordionpanes controls, or directly specify the contentcssclass attribute of the accordionpane control.
Fadetransitions: the gradient effect when it is true (the color fades when it is scaled, and the color returns to normal after it is scaled). If it is false, it is a standard conversion.
Transitionduration: the duration of stretching and shrinking the transition animation after a title is selected, in milliseconds.
Framespersecond: the number of frames required for stretching and shrinking transition animations per second.
Autosize: used to limit the height of the accordion control. The autosize Enumeration type value has been described in the introduction.
Panes: a set of accordionpane controls.
Headertemplate: The title template, which contains tags used for data binding to display the panel title.
Contenttemplate: Content template. The tags contained in the template are used to bind data to display the panel content.
Datasource: Specifies the data source. You must call the databind () method to bind the data.
Performanceid: Specifies a data source using the data source ID.
Datamember: The member used for binding when the datasourceid is used to specify the data source

Requireopenedpane: determines whether to disable the currently opened panel when you click the panel title. True: the current state cannot be closed; false: the current state can be closed.

Suppressheaderpostbacks: whether the PostBack attribute of the title is supported. It is useful when you need to include hyperconnections in the title.
< MAID: accordion ID = " Accordion1 " Runat = " Server " >
< Panes >
< C0: accordionpane ID = " Accordionpane1 " Runat = " Server " >
< Header > ASP. NET Ajax </ Header >
< Content >
ASP. NET Ajax learning ASP. NET Ajax Learning
Learning ASP. NET Ajax learning ASP. NET Ajax learning
ASP. NET Ajax learning ASP. NET Ajax learning ASP. NET Ajax Learning
</ Content >
</ C0: accordionpane >
< C0: accordionpane ID = " Accordionpane2 " Runat = " Server " >
< Header > Accordion </ Header >
< Content >
Accordion learning accordion Learning
Accordion learning accordion Learning
Accordion learning accordion Learning
</ Content >
</ C0: accordionpane >
</ Panes >
</ PC3: accordion >

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.