CYCLOMEDIA

• Name CheckList
• CSS Class table.CC_CheckList, tr.rh, tr.r[n], tr.rn, tr.Selected, col.cb, colgroup.cg, col.c[n], col.cn
• Types int Index, string Value, string Text, string Checked

New in 0.8.1

The CheckList creates a tabular list of Text strings, each having a hidden Value string associated with it. It is not intended to grow into a full Grid but can have a Checkbox column enabled, and even have per-row or header-row buttons attached directly. Allowing you to add (for example) Button.Click() events that fire on the server.

It can however be overloaded to show a simple grid view. Any tab characters ( "\t" in C# ) in the Title property or any of the row Texts will be used to split the row into columns. Because Chan aims to be both flexible and lightweight it is up to you to police these strings for undesired tabs and assert that each row has the same number as the Title.

Because Chan (unlike standard ASPX) does not have a built in viewstate the CheckList will forget its contents whenever the page is loaded or posted back. For this reason you will need to populate it in Page_Init(). However you are free to inherit from the CheckList and use its own Control.Init() to populate it with a set series of values, for example.

CSS Styling

The CheckList comes with built-in basic styling but tries to allow flexibility via the list of class names above.

• The table is table#[ID], where ID is the id given to the CheckList control
• The table is also table.CC_CheckList
• The header row is tr.rh
• The header row cells and all button/checkbox cells are th
• The button/checkbox cells are in their own colgroup col.cb
• All data cells share a colgroup.cg
• All data cells have a single column each as col.c[n], where n is the index of the data-column
• The right-most data cell is also col.cn, for browsers that do not support :last-child
• All data cells' rows are tr.r[n], where n is the index of the data-row
• The bottom-most data row is also tr.rn, for browsers that do not support :last-child
• If the CheckList is of CheckBox or Radio type then any checked rows will also be tr.Selected

ASPX

<%@ Page
    Inherits="MySite.MyPage"
%>
	
<Chan:Form runat="server" id="frm">
    <Chan:CheckList runat="server" id="lst" type="checkbox" title="Fruit\tColour"/>
</Chan:Form>
<Chan:CSS runat="server">
	/*
		Set the data-column widths via their colgroup
	*/
	table#lst colgroup.cg
	{
		width: 100px;
	}
</Chan:CSS>
	

C#

using System;
using Chan;

namespace MySite
{
    public class MyPage : Chan.Page
    {
        protected Chan.Controls.CheckList lst;
        
        protected override void Page_Init()
        {
            //add a delete button with javascript confirmation
            Chan.Controls.Button b = new Chan.Controls.Button();
            b.ID = "btnDelete";
            b.Image = "[Icon.Delete]";
            b.Text = "Delete";
            b.OnClick = "return confirm('Really Delete [Text]?')";
            b.Click = this.btnDelete_Click;
            
            lst.Buttons.Add( b );
        }
        
        
        protected override void Page_Load()
        {
            //Fill it
            DataReader dr = Database.tblFruit.GetReader();
            while( dr.Read() )
                lst.Add( dr["FruitID"] , dr["FruitName"].ToString() + "\t" + dr["FruitColour"].ToString() );
        }        
        
        private void btnDelete_Click()
        {
            //Delete it
            Database.tblFruit.Delete( lst.Value );
			lst.Remove( lst.Clicked );
        }
    }
}