@using HotelContracts.ViewModels;
@using HotelDataModels.Models;

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

<head>
	<link rel="stylesheet" href="~/css/createmember.css" asp-append-version="true" />
	<link rel="stylesheet" href="~/css/updateconference.css" asp-append-version="true" />
</head>

<form method="post">
	<div class="u-form-group u-form-name u-label-top">
		<label class="u-label u-text-custom-color-1 u-label-1">Конференция: </label>
		<div class="u-input u-input-rectangle">
			<select id="conference" name="conference" class="form-control" asp-items="@(new SelectList(@ViewBag.Conferences, "Id", "ConferenceName"))"></select>
		</div>
	</div>
	<div class="u-form-group u-form-name u-label-top">
							<label class="u-label u-text-custom-color-1 u-label-1">Название конференции</label>
							<input
                              type="text"
							  id="conferenceName"
                              placeholder="Введите название конференции"
                              name="conferenceName"
                              class="u-input u-input-rectangle"/>
						  </div>
	<div class="u-form-email u-form-group u-label-top">
							<label class="u-label u-text-custom-color-1 u-label-2">Начало</label>
							<input
                              type="datetime-local"
							  id="startDate"
                              placeholder="Выберите начало конференции"
                              name="startDate"
                              class="u-input u-input-rectangle"/>
						  </div>
						  <div class="u-table u-table-responsive u-table-1">
							  <label class="u-label u-text-custom-color-1 u-label-1">Участники конференции</label>
						  <table class="u-table-entity">
							  <colgroup>
						<col width="63%" />
						<col width="37%" />
					  </colgroup>
		<thead class="u-custom-color-1 u-table-header u-table-header-1">
			<tr style="height: 44px">
				<th class="u-border-1 u-border-black u-table-cell">
					Участники
				</th>
				<th class="u-border-1 u-border-black u-table-cell">
					Гражданство
				</th>
			</tr>
		</thead>
		<tbody class="u-table-body" id="table-elements">

		</tbody>
	</table>
	</div>
	<div class="u-align-right u-form-group u-form-submit u-label-top">
		<div class="col-8"></div>
		<div class="col-4"><input type="submit" value="Сохранить" class="u-active-custom-color-6 u-border-none u-btn u-btn-submit u-button-style u-custom-color-1 u-hover-custom-color-2 u-btn-1" /></div>
	</div>
</form>

@section Scripts
	{
			<script>
				function check() {
							var conference = $('#conference').val();
							if (conference) {
						$.ajax({
							method: "GET",
								url: "/Home/GetConference",
											data: { conferenceId: conference },
							success: function (result) {
									$('#conferenceName').val(result.item1.conferenceName);
								$('#startDate').val(result.item1.startDate);
								$('#table-elements').html(result.item2);
							}
						});
					};
				}
				check();
						$('#conference').on('change', function () {
						check();
				});
			</script>
}
