#asp.net-core #razor #razor-pages
Вопрос:
у меня есть раскрывающийся список, и я хочу перезагрузить данные, как только я изменю раскрывающийся список, пожалуйста, обратите внимание, что поле флажка также возвращает страницу для обновления базы данных ниже, является файлом cs и опубликует cshtml после
public class IndexModel : PageModel
{
private readonly IpponAcademy.Models.IJAContext _context;
public List<SelectListItem> judokaGroupList { get; set; }
[BindProperty]
public Boolean IsAttend { get; set; }
public IList<tbl_Judoka> tbl_Judoka { get;set; }
public IndexModel(IpponAcademy.Models.IJAContext context)
{
_context = context;
}
public void OnGet(Guid? id)
{
var GroupList = _context.LK_Groups.ToList();
judokaGroupList = GroupList.Select(a =>
new SelectListItem
{
Value = a.Group_GUID.ToString(),
Text = a.Group_Name
}).OrderBy(t => t.Text).ToList();
if (id == null)
{
id = Guid.Parse("7F299B82-3397-40F2-8105-65AECB1BA2A8"); //Group A
}
tbl_Judoka = _context.tbl_Judokas.Where(c => c.tbl_Judoka_Groups.Any(o => o.Is_Active == true amp;amp; o.Group_GUID == id)).Include(c => c.tbl_Judoka_Groups.Where(o => o.Is_Active == true amp;amp; o.Group_GUID == id)).ToList();
}
public void OnGetJudoka(Guid? id)
{
var GroupList = _context.LK_Groups.ToList();
judokaGroupList = GroupList.Select(a =>
new SelectListItem
{
Value = a.Group_GUID.ToString(),
Text = a.Group_Name
}).OrderBy(t => t.Text).ToList();
if (id == null)
{
id = Guid.Parse("7F299B82-3397-40F2-8105-65AECB1BA2A8"); //Group A
}
tbl_Judoka = _context.tbl_Judokas.Where(c => c.tbl_Judoka_Groups.Any(o => o.Is_Active == true amp;amp; o.Group_GUID == id)).Include(c => c.tbl_Judoka_Groups.Where(o => o.Is_Active == true amp;amp; o.Group_GUID == id)).ToList();
}
}
ниже приведен файл cshtml, я был бы признателен, если бы нашел простой способ обновить данные с помощью нового выбранного поля из выпадающего списка
@page
@model IpponAcademy.Pages.Attendance.IndexModel
@{
ViewData["Title"] = "Index";
Layout = "~/Pages/Shared/_Layout.cshtml";
}
<form method="post">
<div class="form-group">
<label class="control-label">Group</label>
<select id="ddlGroup" class="form-control" asp-items="Model.judokaGroupList"></select>
@*onchange="alert(@Model.judokaGroupList)"*@
</div>
<table id="taskDt" class="table table-striped table-bordered nowrap" style="width:100%">
<thead>
<tr>
<th>
Attended
</th>
<th>
Code
</th>
<th>
Image
</th>
<th>
Judoka
</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model.tbl_Judoka)
{
var imagePath = @"UploadedFiles/" item.J_Image;
<tr>
<td>
<input type="hidden" name="J_GUID" id="J_GUID" value="@item.J_GUID" />
<input asp-for="IsAttend" name="IsAttend" id="IsAttend" type="checkbox" onclick="this.form.submit()" />
</td>
<td>
@Html.DisplayFor(modelItem => item.J_Code)
</td>
<td align="center">
<img src="@imagePath" alt="Judoka" width="50" height="50" class="rounded-circle mr-1" onclick="return LoadDiv(this.src);" style="cursor: pointer" />
</td>
<td>
@Html.DisplayFor(modelItem => item.J_Name)
</td>
</tr>
}
</tbody>
</table>
</form>
@section scripts{
<script>
var table;
function LoadData() {
//alert('in');
table = $("#taskDt").DataTable({
paging: true,
responsive: true,
searching: true,
ordering: true,
order: [[1, "asc"]]
});
}
$(document).ready(function () {
LoadData();
})
$("#ddlGroup").change(function () {
alert('DDLGroup');
//table.ajax.url("/Attendance/Index?handler=GETamp;Id=" $("#ddlGroup Option:Selected").val()).load();
window.location.href = '/Attendance/Index?handler=Judokaamp;Id=' $("#ddlGroup Option:Selected").val();
});
</script>
}
Ответ №1:
Я думаю, что использование window.location.href
было достаточно простым способом обновить данные.Только одну вещь вам нужно улучшить, OnGet
и OnGetJudoka
метод один и тот же,почему бы не использовать только один метод.
Изменить:
$("#ddlGroup").change(function () {
window.location.href = '/Attendance/Index?handler=Judokaamp;Id=' $("#ddlGroup Option:Selected").val();
});
Для:
$("#ddlGroup").change(function () {
window.location.href = '/Attendance/Index?Id=' $("#ddlGroup Option:Selected").val();
});
Если вам нужно использовать другой способ,вы могли бы использовать form.submit()
:
Примечание:Обязательно добавьте name="id"
,иначе параметр не будет привязан к серверной части.
<form method="post" asp-page-handler="Judoka">
<div class="form-group">
<label class="control-label">Group</label>
<select id="ddlGroup" class="form-control" name="id" asp-items="Model.judokaGroupList"
onchange="this.form.submit()"></select>
</div>
</form>
Внутренний код:
Изменить:
public void OnGetJudoka(Guid? id)
Для:
public void OnPostJudoka(Guid? id)
Кстати,у меня также есть предложение, что вам лучше сохранить выбранное значение после обратной передачи :
public void OnGetJudoka(Guid? id)
{
var GroupList = _context.LK_Groups.ToList();
judokaGroupList = GroupList.Select(a =>
new SelectListItem
{
Value = a.Group_GUID.ToString(),
Text = a.Group_Name
}).OrderBy(t => t.Text).ToList();
//maintain the selected value after post back...
var selectedValue= judokaGroupList.Where(a => a.Value == id.ToString()).FirstOrDefault();
selectedValue.Selected = true;
//...
}