<!DOCTYPE HTML>
<html lang="en">
<head>
<title>TinyButStrong - Example of item selection</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="./tbs_us_examples_styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main-body">
<h1>Example of item selection</h1>
<div class="w3cinfo"> this TBS template is W3C compliant <a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml11" alt="Valid XHTML 1.1" height="31" width="88" style="border:none;" /></a> </div>
<div id="example">
<p> The plug-in named "HTML" can help to select items in a list, a series of radio buttons or of checkboxes.</p>
<p> For list feeding, you just have to use a normal block bounded by the tags <span class="text-example2"><option></span>.</p>
<form action="" method="post" id="form1">
<table width="500" border="0" cellpadding="2" cellspacing="0" class="back-special2">
<tr>
<td align="left" valign="top"> </td>
<td class="title-section2">List with values</td>
<td class="title-section2">List without values</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="left" valign="top" class="title-section2">Feeding a list:</td>
<td><select name="list_1v" size="5" multiple="multiple">
<option value="[lst1v.id]">[lst1v.name;block=option]</option>
</select></td>
<td><select name="list_1" size="5" multiple="multiple">
<option>[lst1.name;block=option]</option>
</select></td>
</tr>
<tr>
<td align="left" valign="top"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="left" valign="top" class="title-section2">Single selection:</td>
<td><select name="list_2v" size="5" multiple="multiple">
<option value="1">Red</option>
<option value="2">Green</option>
<option value="3">Blue</option>
<option value="4">Yellow</option>
<option value="5">White</option>
<option>[onshow.sel1_id;ope=html;select]</option>
</select></td>
<td><select name="list_2" size="5" multiple="multiple">
<option>Red</option>
<option>Green</option>
<option>Blue</option>
<option>Yellow</option>
<option>White</option>
<option>[onshow.sel1_name;ope=html;select]</option>
</select></td>
</tr>
<tr>
<td align="left" valign="top"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="left" valign="top" class="title-section2">Multiple selection:</td>
<td><select name="list_3v" size="5" multiple="multiple" id="list_3v">
<option value="1">Red</option>
<option value="2">Green</option>
<option value="3">Blue</option>
<option value="4">Yellow</option>
<option value="5">White</option>
<option>[onshow.sel2_id;ope=html;select]</option>
</select></td>
<td><select name="list_3" size="5" multiple="multiple" id="list_3">
<option>Red</option>
<option>Green</option>
<option>Blue</option>
<option>Yellow</option>
<option>White</option>
<option>[onshow.sel2_name;ope=html;select]</option>
</select></td>
</tr>
<tr>
<td align="left" valign="top"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td align="left" valign="top" class="title-section2">Feeding and selecting:</td>
<td><select name="list_4v" size="5" multiple="multiple" id="list_4v">
<option value="[lst3v.id]">[lst3v.name;block=option]</option>
<option>[onshow.sel1_id;ope=html;select]</option>
</select></td>
<td><select name="list_4" size="5" multiple="multiple" id="list_4">
<option>[lst3.name;block=option]</option>
<option>[onshow.sel1_name;ope=html;select]</option>
</select></td>
</tr>
<tr>
<td align="left" valign="top"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<p></p>
<table width="500" border="0" cellpadding="2" cellspacing="0" class="back-special2">
<tr>
<td align="left" valign="top" class="title-section2">Radio button and Checkbox selection:</td>
</tr>
<tr>
<td> [onshow.sel1_name;ope=html;select=radio1]</td>
</tr>
<tr>
<td align="left" valign="top"><input type="radio" name="radio1" id="radio1" value="Red" />
->Red
<input type="radio" name="radio1" id="radio2" value="Green" />
->Green
<input type="radio" name="radio1" id="radio3" value="Blue" />
->Blue
<input type="radio" name="radio1" id="radio4" value="Yellow" />
->Yellow
<input type="radio" name="radio1" id="radio5" value="White" />
->White </td>
</tr>
<tr>
<td> [onshow.sel2_name;ope=html;select=check1]</td>
</tr>
<tr>
<td><input name="check1" type="checkbox" id="check1" value="Red" />
->Red
<input name="check1" type="checkbox" id="check2" value="Green" />
->Green
<input name="check1" type="checkbox" id="check3" value="Blue" />
->Blue
<input name="check1" type="checkbox" id="check4" value="Yellow" />
->Yellow
<input name="check1" type="checkbox" id="check5" value="White" />
->White </td>
</tr>
<tr>
<td align="left" valign="top"> </td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>