<?= $this->extend('layouts/main.php') ?>

<?= $this->section('content') ?>
<div class="card border-0">
	<div class="card-body">
		<div class='card-title'>Dictionary Test</div>
		<button class='btn btn-sm btn-success mx-3 my-2' onclick='create()'><i class='bi bi-plus-circle'></i> Create</button>
		<div class="table-responsive">
			<table id="myTable" class="table">
				<thead>
					<tr>
						<th>Testcode</th>
						<th>Shorttext</th>
						<th>Text 1</th>
						<th>Action</th>
					</tr>
				</thead>
				<tbody id='table-body'>
				</tbody>
			</table>
		</div>
	</div>
</div>
<?= $this->endSection() ?>

<?= $this->section('script') ?>
<script>
index();
function index() {
	let url = '<?=base_url('');?>api/dictTests/index';
	$.ajax({
		url: url,
		method: 'GET',
		success: function(response) {
			$("#table-body").html("");
			var data = response['dictTests'];
			for (var i = 0; i < data.length; i++) {
				let editBtn =  '<button class="btn btn-sm btn-success" ' + ' onclick="edit(' + data[i].TESTCODE + ')">Edit' + '</button> ';
				//let deleteBtn =  '<button class="btn btn-sm btn-danger" ' + ' onclick="delete(' + data[i].USERROLEID + ')">Delete' + '</button>';

				let datarow = '<tr class="align-middle">' + 
					'<td>' + data[i].TESTCODE + '</td>' + '<td>' + data[i].SHORTTEXT+ '</td>' + '<td>' + data[i].TEXT1+ '</td>' + '<td>' + editBtn + '</td>' +
				'</tr>';
				$("#table-body").append(datarow);
			}
		},
		error: function(response) { console.log(response.responseJSON); }
	});
}
</script>
<?= $this->endSection() ?>