Custom Web Control

After several days of hard work, four controls were developed: Paging control, verification code control, date Selection control, and collapse panel control. The following describes how to use each control. We also hope that you will give us valuable comments on the change.

1. pagingpanel)

< FSC: pagingpanel Runat = "Server" ID = "Pagingpanel1" Pagenumbercount = "7" > </ FSC: pagingpanel >

The pagination control supports data controls such as DataGrid, datalist, and repeater, and datalist supports multi-Column Display. Supported data sources include array, arraylist, able, and dataview.

Private   Void BIND ()
{
Pagingpanel1.pagesize =   20 ; // Rows per page
Pagingpanel1.repeatcolumns =   4 ; // Multiple Columns
Datalist1.datasource = Pagingpanel1.setdatasource (datatable1 ); // Convert data sources
Datalist1.databind ();
}

Use activation event Pageindexchange For Paging Private   Void Pagingpanel1_pageindexchanged ( Object Sender, faibclass. webcontrols. pageindexchangedeventargs E)
{
Pagingpanel1.currentpageindex=E. newpageindex;
BIND ();
}

Partial attribute description
Autopostback
IfFalseYou do not need to use the event pageindexchanged to implement data paging, that is, the page number is transmitted through request. querystring.

Repeatcolumns
This attribute is used for association with datalist, which is consistent with the repeatcolumns attribute of datalist.

Showfirstlast
Whether the "Homepage" and "last page" buttons are displayed.

Showpagebox, showpagelist
Whether to display the page number input box and page number list box.

Pagenumbercount
Display the Quick Page number jump string, starting and ending.

Ii. validatebox)<FSC: validateboxRunat= "Server"ID= "Validatebox1"Imageurl= "Vercode.jpg"> </FSC: validatebox>

Before using verification, add the following content to Web. config: < System. Web >
< Httphandlers >
< Add verb = " Get " Path = " *. FBS. ashx " Type = " Faibclass. webcontrols. ashxhandler, faibclass. webcontrols " />
</ Httphandlers >
</ System. Web >

This control is easy to use. You only need to specify an imageurl and the properties can be used by the customer service.ValueTo obtain the verification code.

Partial attribute description
Length
The number of digits of the verification code.

Textangle
The Rotation Angle of the font.

3. Date Selection Control (calendarbox)

< FSC: calendarbox Runat = "Server" ID = "Calendarbox1" Showstyle = "Oncontextmenu" > </ FSC: calendarbox >

 

Like valiedatebox, this control requires httphandler to be added to Web. config.
This control allows you to freely define the date format and the corresponding CSS style.

Partial attribute description
Dataformat
Set the date format, ymd -- year month day mdy -- Month day year DMY -- day month year

Dataseparator
Delimiter of year, month, and day in date

Showstyle
Custom Selection Panel pop-up method onclick -- ondblclick when clicked -- onfocus when double-clicking -- oncontextmenu when getting focus -- Right-click the menu

Iv. Collapse panel control (collapablepanel) < FSC: collapablepanel ID = "Collapablepanel1" Runat = "Server" Panelcolor = "Yellow" Panelcssclass = "Panel" Cssclass = "TT"
Borderwidth = "1px" Borderstyle = "Solid" Bordercolor = "#404000" Backcolor = "# Ffe0c0" Width = "175px" Expandsolepanel = "True" >
< FSC: collpanel Text = "System Menu" Backcolor = "" >
< FSC: collitem Imageurl = "Save.gif" Text = "My Documents" Commandname = "Myinfo" > </ FSC: collitem >
< FSC: collitem Imageurl = "Save.gif" Text = "Change Password" Commandname = "Modifypwd" > </ FSC: collitem >
< FSC: collitem Imageurl = "Save.gif" Text = "Log out" Commandname = "Logout" > </ FSC: collitem >
</ FSC: collpanel >
< FSC: collpanel Text = "Member management" Backcolor = "" >
< FSC: collitem Imageurl = "Save.gif" Text = "New member" Commandname = "Addmember" > </ FSC: collitem >
< FSC: collitem Imageurl = "Save.gif" Text = "Member management" Commandname = "Member" > </ FSC: collitem >
< FSC: collitem Imageurl = "Save.gif" Text = "Member renewal" Commandname = "Safe" > </ FSC: collitem >
</ FSC: collpanel >
< FSC: collpanel Text = "Other management" Backcolor = "" >
< FSC: collitem Imageurl = "Save.gif" Text = "ARCHIVE entry" Commandname = "Safe" > </ FSC: collitem >
</ FSC: collpanel >
</ FSC: collapablepanel >

Partial attribute description
Autopostback
If this attribute is set to true, you can use the control collitemcommand event to perform operations. Each collitem should specify a commandname. If this attribute is set to false, use a URL to link to other pages.

Expandsolepanel
If it is set to true, only one item can be expanded.

========================================================== ======================================

This control is still in the testing stage: http://files.cnblogs.com/faib/faibclass.webcontrols.rar. (Download disabled now. Contact me if necessary)