summaryrefslogtreecommitdiff
path: root/demos/quickstart/protected/pages/Controls/List.page
blob: 5e78bb1396e60f8f9313d818444a538b73490adc (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<com:TContent ID="body" >

<h1 id="4801">List Controls</h1>
<p id="550329" class="block-content">
List controls covered in this section all inherit directly or indirectly from <tt>TListControl</tt>. Therefore, they share the same set of commonly used properties, including,
</p>
<ul id="u1" class="block-content">
<li><tt>Items</tt> - list of items in the control. The items are of type <tt>TListItem</tt>. The item list can be populated via databinding or specified in templates like the following:
<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_550115">
&lt;com:TListBox&gt;
  &lt;com:TListItem Text="text 1" Value="value 1" /&gt;
  &lt;com:TListItem Text="text 2" Value="value 2" Selected="true" /&gt;
  &lt;com:TListItem Text="text 3" Value="value 3" /&gt;
&lt;/com:TListBox&gt;
</com:TTextHighlighter>
</li>
<li><tt>SelectedIndex</tt> - the zero-based index of the first selected item in the item list.</li>
<li><tt>SelectedIndices</tt> - the indices of all selected items.</li>
<li><tt>SelectedItem</tt> - the first selected item in the item list.</li>
<li><tt>SelectedValue</tt> - the value of the first selected item in the item list.</li>
<li><tt>AutoPostBack</tt> - whether changing the selection of the control should trigger postback.</li>
<li><tt>CausesValidation</tt> - whether validation should be performed when postback is triggered by the list control.</li>
</ul>

<p id="550330" class="block-content">
Since <tt>TListControl</tt> inherits from <tt>TDataBoundControl</tt>, these list controls also share a common operation known as <tt>databinding</tt>. The <tt>Items</tt> can be populated from preexisting data specified by <tt>DataSource</tt> or <tt>DataSourceID</tt>. A function call to <tt>dataBind()</tt> will cause the data population. For list controls, data can be specified in the following two kinds of format:
</p>
<ul id="u2" class="block-content">
  <li>one-dimensional array or objects implementing <tt>ITraversable</tt> :  array keys will be used as list item values, and array values will be used as list item texts. For example
<com:TTextHighlighter CssClass="source block-content" id="code_550116">
$listbox->DataSource=array(
	'key 1'=>'item 1',
	'key 2'=>'item 2',
	'key 3'=>'item 3');
$listbox->dataBind();
</com:TTextHighlighter>
</li>
  <li>tabular (two-dimensional) data : each row of data populates a single list item. The list item value is specified by the data member indexed with <tt>DataValueField</tt>, and the list item text by <tt>DataTextField</tt>. For example,
<com:TTextHighlighter CssClass="source block-content" id="code_550117">
$listbox->DataTextField='name';
$listbox->DataValueField='id';
$listbox->DataSource=array(
	array('id'=>'001','name'=>'John','age'=>31),
	array('id'=>'002','name'=>'Mary','age'=>30),
	array('id'=>'003','name'=>'Cary','age'=>20));
$listbox->dataBind();
</com:TTextHighlighter>
</li>
</ul>

<h2 id="4802">TListBox</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TListBox" />
<p id="550331" class="block-content">
<tt>TListBox</tt> displays a list box that allows single or multiple selection. Set the property <tt>SelectionMode</tt> as <tt>Single</tt> to make a single selection list box, and <tt>Multiple</tt> a multiple selection list box. The number of rows displayed in the box is specified via the <tt>Rows</tt> property value.
</p>
<com:RunBar PagePath="Controls.Samples.TListBox.Home" />

<h2 id="4803">TDropDownList</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TDropDownList" />
<p id="550332" class="block-content">
<tt>TDropDownList</tt> displays a dropdown list box that allows users to select a single option from a few prespecified ones.
</p>
<p class="block-content">
Since v3.1.1, <tt>TDropDownList</tt> starts to support prompt text (something like 'Please select:' as the first list item). To use this feature, set either <tt>PromptText</tt> or <tt>PromptValue</tt>, or both. If the user chooses the prompt item, the dropdown list will be unselected.
</p>
<com:RunBar PagePath="Controls.Samples.TDropDownList.Home" />

<h2 id="4804">TCheckBoxList</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TCheckBoxList" />
<p id="550333" class="block-content">
<tt>TCheckBoxList</tt> displays a list of checkboxes on a Web page. The alignment of the text besides each checkbox can be specified <tt>TextAlign</tt>. The layout of the checkboxes can be controlled by the following properties:
</p>
<ul id="u3" class="block-content">
  <li><tt>RepeatLayout</tt> - can be either <tt>Table</tt> or <tt>Flow</tt>. A <tt>Table</tt> uses HTML table cells to organize the checkboxes, while a <tt>Flow</tt> uses HTML span tags and breaks for the organization. With <tt>Table</tt> layout, you can set <tt>CellPadding</tt> and <tt>CellSpacing</tt>.</li>
  <li><tt>RepeatColumns</tt> - how many columns the checkboxes should be displayed in.</li>
  <li><tt>RepeatDirection</tt> - how to traverse the checkboxes, in a horizontal way or a vertical way (because the checkboxes are displayed in a matrix-like layout).</li>
</ul>

<com:RunBar PagePath="Controls.Samples.TCheckBoxList.Home" />

<h2 id="4805">TRadioButtonList</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TRadioButtonList" />
<p id="550334" class="block-content">
<tt>TRadioButtonList</tt> is similar to <tt>TCheckBoxList</tt> in every aspect except that each <tt>TRadioButtonList</tt> displays a group of radiobuttons. Only one of the radiobuttions can be selected (<tt>TCheckBoxList</tt> allows multiple selections.)
</p>
<com:RunBar PagePath="Controls.Samples.TRadioButtonList.Home" />

<h2 id="4806">TBulletedList</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TBulletedList" />
<p id="550335" class="block-content">
<tt>TBulletedList</tt> displays items in a bullet format on a Web page. The style of the bullets can be specified by <tt>BulletStyle</tt>. When the style is <tt>CustomImage</tt>, the bullets are displayed as images, which is specified by <tt>BulletImageUrl</tt>.
</p>
<p id="550336" class="block-content">
<tt>TBulletedList</tt> displays the item texts in three different modes,
</p>
<ul id="u4" class="block-content">
  <li><tt>Text</tt> - the item texts are displayed as static texts;</li>
  <li><tt>HyperLink</tt> - each item is displayed as a hyperlink whose URL is given by the item value, and <tt>Target</tt> property can be used to specify the target browser window;</li>
  <li><tt>LinkButton</tt> - each item is displayed as a link button which posts back to the page if a user clicks on that, and the event <tt>OnClick</tt> will be raised under such a circumstance.</li>
</ul>

<com:RunBar PagePath="Controls.Samples.TBulletedList.Home" />

<h2 id="128001">TRatingList</h2>
<com:DocLink ClassPath="System.Web.UI.WebControls.TRatingList" />

<p class="block-content">
This is an EXPERIMENTAL class that displays clickable images that represent a TRadioButtonList.
</p>

<com:RunBar PagePath="Controls.Samples.TRatingList.Home" />

</com:TContent>