У меня есть код страницы для выбора теста :
<div class="col-lg-12">
<div class="row row-grid text-center center-block">
<div class="col-lg-4" style="margin-left: auto; margin-right: auto;">
<div class="card card-lift--hover shadow border-0">
<div class="card-body py-5">
<div class="icon icon-shape icon-shape-primary rounded-circle mb-4">
<i class="ni ni-check-bold"></i>
</div>
<h6 class="text-primary text-uppercase">Выберите класс</h6>
<button data-class="10" name="Class" value="10" class="btn btn-primary mt-4 class-select">10 класс</button>
<button data-class="11" name="Class" value="11" class="btn btn-primary mt-4 class-select">11 класс</button>
</div>
</div>
</div>
<div class="col-lg-4 subjects" style="display: none;">
<div class="card card-lift--hover shadow border-0">
<div class="card-body py-5">
<div class="icon icon-shape icon-shape-success rounded-circle mb-4">
<i class="ni ni-istanbul"></i>
</div>
<h6 class="text-success text-uppercase">Выберите предмет</h6>
<div id="subject-content" name="subject-content">
<!--<button data-subject="2" name="SubjectId" id="S" value="2" class="btn btn-success mt-4 col-md-12 subject-select">Информатика</button>-->
</div>
</div>
</div>
</div>
<div class="col-lg-4 subjects" style="display: none; padding:0;">
<div class="col-lg-12 tests" style="display: none;">
<div class="card card-lift--hover shadow border-0">
<div class="card-body py-5">
<div class="icon icon-shape icon-shape-warning rounded-circle mb-4">
<i class="ni ni-planet"></i>
<!--<input type="hidden" value="Int32.Parse(HttpContext.Current.Request.Cookies["Form"].Value)" name="Form">-->
</div>
<h6 class="text-warning text-uppercase">Выбери тест</h6>
<div id="tests-content"></div>
</div>
</div>
</div>
</div>
далее идёт запрос в бд через ajax для вставки кода в элемент subject-content:
$('#username').html(getCookie('Name'));
$('.class-select').on('click', function () {
$('.subjects').fadeIn(500);
var studentClass = $(this).attr('data-class');
setCookie('Form', studentClass);
$.ajax({
url: 'Home/AjaxUpdateListSubjects?Form=' + studentClass, success: function (data) {
$('#subject-content').html(data).fadeIn(500);
}
});
});
где Метод действия контроллера :
[HttpGet]
public ActionResult AjaxUpdateListSubjects(int Form)
{
HttpContext.Response.Cookies["Form"].Value = Form.ToString();
var ListUpdate = test.Subjects.Where(m => m.Form == Form).ToArray();
return PartialView("ListPartial", ListUpdate);
}
и Partial View :
@model IEnumerable<ASP.NET_Test_Application.Models.Subject>
@{
foreach (var subject in Model)
{
<button data-subject="@subject.Id" name="SubjectId" value="@subject.Id" class="btn btn-success mt-4 subject-select col-md-12">@subject.SubjectName</button>
}
}
но потом должен выполняться второй Ajax запрос на вставку тестов :
$('.subject-select').on('click', function () {
console.log('tests');
$('.tests').fadeIn(500);
var subject = $(this).attr('data-subject');
$.ajax({
url: 'Home/AjaxUpdateListTests?Form=' + getCookie('Form') + '&SubjectId=' + subject, success: function (data) {
console.log(data);
$('#tests-content').html(data).fadeIn(500);
}
});
});
Где метод действия контроллера :
[HttpGet]
public ActionResult AjaxUpdateListTests(int Form ,int SubjectId )
{
Session["List"] = test.Test.Where(m => m.Form == Form).Where(m => m.SubjectId == SubjectId).ToList();
return PartialView("TestPartial", Session["List"]);
}
и Partial View :
@model List<ASP.NET_Test_Application.Models.Test>
@foreach (var test in Model)
{
<a href="#" name="" class="btn btn-warning mt-4">@test.TestName</a>
}
Но дело в том что второй ajax-запрос не работает.... Буду благодарен за любую помощь....
Потому что в момент назначения обработчика
$('.subject-select').on('click', function () {
элементов с .subject-select
еще нет.
$('#subject-content').on('click', '.subject-select', function () {
Виртуальный выделенный сервер (VDS) становится отличным выбором
Я нашел способ создать фиксированный контейнер с blur-эффектом, как оказалось способ простой, но достаточно страшныйЧто будет с индексацией...