gistfile1.txt

<template>

	<style>
		tr.shown td div.details-control {
			background: url(https://datatables.net/examples/resources/details_close.png) no-repeat center center;
			width: 40px;
			height: 40px;
			cursor: hand;
			cursor: pointer;
		}
		tr td div.details-control {
			background: url(https://datatables.net/examples/resources/details_open.png) no-repeat center center;
			width: 40px;
			height: 40px;
			cursor: hand;
			cursor: pointer;
		}
	</style>

	<require from="./details-col"></require>
	<require from="./resources/elements/datatable"></require>
	<require from="bootstrap/css/bootstrap.css"></require>
	<div style="margin: 16px;">
		<div style="margin-top: 30px; margin-bottom: 30px;">
			<select value.bind="selectedCurrency">
				<!-- <option>Select a currency</option> -->
				<option repeat.for="currency of currencies" value.bind="currency">${currency}</option>
			</select>
		</div>
		<input type="checkbox" checked.bind="checked">
	 
		<div class="table-responsive" if.bind="checked">
			<data-table view-model.ref="table1">
				<table id="test" ref="myTable" class="table" width="100%" cellspacing="0">
					<thead>
						<tr>
							<th></th>
							<th>Name</th>
							<th></th>
						</tr>
					</thead>
				</table>
			</data-table>
		</div>
		
		 <div class="table-responsive" if.bind="!checked">
			 <data-table view-model.ref="table2">
				 <table id="test" ref="myTable" class="table" width="100%" cellspacing="0">
					 <thead>
						 <tr>
							 <th></th>
							 <th>Name</th>
							 <th></th>
						 </tr>
					 </thead>
				 </table>
			 </data-table>
		 </div>
	</div>
</template>