AP01 Add/Remove Product Bar Component

Copy the code below and paste into your text editor.

<div class="ap1v1 ap1v1Collapsed">
	<div class="header ">Add or Remove Products</div>
	<table>
		<thead>
			<tr>
				<th>Products available for comparison:</th>
				<th>Products selected for comparison:</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>
					<div class="chooser" id="availableproducts">
						<ul>
							<li class="group-heading">Cool Threads Servers</li>
							<li><label><input type="checkbox" id="server1" value="Sun Fire T1000 Server"/> Sun Fire T1000 Server</label></li>
							<li><label><input type="checkbox" id="server2"  value="Sun Fire T2000 Server"/> Sun Fire T2000 Server</label></li>

<li class="group-heading">x64 Servers</li>
							<li><label><input type="checkbox" id="server3" value="Sun Fire X4600 Server"/> Sun Fire X4600 Server</label></li>
							<li><label><input type="checkbox" id="server4" value="Sun Fire X4500 Server"/> Sun Fire X4500 Server</label></li>

<li class="group-heading">Entry Level Servers</li>
							<li><label><input type="checkbox" id="server5" value="Sun Fire V240 Server"/> Sun Fire V240 Server</label></li>
							<li><label><input type="checkbox" id="server6" value="Sun Fire V210 Server"/> Sun Fire V210 Server</label></li>
							<li><label><input type="checkbox" id="server7" value="Sun Fire V440 Server"/> Sun Fire V440 Server</label></li>

<li class="group-heading">Midrange Servers</li>
							<li><label><input type="checkbox" id="server8" value="Sun Fire V490 Server"/> Sun Fire V490 Server</label></li>
							<li><label><input type="checkbox" id="server9" value="Sun Fire V890 Server"/> Sun Fire V890 Server</label></li>
							<li><label><input type="checkbox" id="server10" value="Sun Fire V2900 Server"/> Sun Fire E2900 Server</label></li>
							<li><label><input type="checkbox" id="server11" value="Sun Fire V4900 Server"/> Sun Fire E4900 Server</label></li>
							<li><label><input type="checkbox" id="server12" value="Sun Fire V6900 Server"/> Sun Fire E6900 Server</label></li>
							<li><label><input type="checkbox" id="server13" value="Sun Fire V480 Server"/> Sun Fire V480 Server</label></li>
							<li><label><input type="checkbox" id="server14" value="Sun Fire V1280 Server"/> Sun Fire V1280 Server</label></li>
						</ul>
					</div>
				</td>
				<td>
					<div class="chooser" id="selectedproducts">
						<ul></ul>
					</div>
				</td>
			</tr>
			<tr>
				<td class="small">Selected products will be sorted by price.</td>
				<td align="right"><input type="submit" class="buttonblue" value="Compare Selected"/></td>
			</tr>
		</tbody>
	</table>
</div>

AP01 Add/Remove Product Bar

Include:

Definition

Usage

v0 Add/Remove Product Bar

No Templates Reference this