@using HospitalContracts.ViewModels;
@using HospitalDataModels.Models;

@{
	ViewData["Title"] = "UpdateRecipe";
}

<div class="text-center">
	<h2 class="display-4">Изменение рецепта</h2>
</div>
<form method="post">
	<div class="row">
		<label class="lable">Рецепт: </label>
		<div>
			<select id="recipe" name="recipe" class="form-control" asp-items="@(new SelectList(@ViewBag.Recipes, "Id", "Id"))"></select>
		</div>
	</div>
	<div class="row">
		<label class="lable">Доза</label>
		<input type="text"
			   id="dose"
			   placeholder="Введите дозу"
			   name="dose" />
	</div>
	<div class="row">
		<label class="lable">Способ применения</label>
		<input type="text"
			   id="modeofapplication"
			   placeholder="Введите способ применения"
			   name="modeofapplication"/>
	</div>
	<div class="row">
		<label class="lable">Симптомы</label>
		<select id="symptoms" name="symptoms" class="form-control" asp-items="@(new SelectList(@ViewBag.Symptomses,"Id", "SymptomName"))"></select>
	</div>
	<div class="row">
		<p class="text-center"><strong>Процедуры</strong></p>
		<table id="proceduresTable" class="table table-bordered table-striped">
				<tr>
					<th>Название</th>
					<th>Тип</th>
				</tr>
			<tbody class="u-table-body" id="table-elements">
			</tbody>
		</table>
	</div>
	<div class="row">
		<div class="col-8"></div>
		<div class="col-4"><input type="submit" value="Сохранить" class="btn btn-success" /></div>
	</div>
</form>

@section Scripts
	{
	<script>
		function check() {
			var recipe = $('#recipe').val();
			if (recipe) {
				$.ajax({
					method: "GET",
					url: "/Home/GetRecipe",
					data: { recipeId: recipe },
					success: function (result) {
						$('#dose').val(result.item1.dose);
						$('#modeofapplication').val(result.item1.modeOfApplication);
						$('#symptoms').val(result.item1.symptoms);
						$('#table-elements').html(result.item2);
					}
				});
			};
		}
		check();
		$('#recipe').on('change', function () {
			check();
		});
	</script>
}