在partialview .Net 6之外更新文本
在partialview .Net 6之外更新文本
提问于 2022-08-05 14:38:28
我使用partialview从对象列表创建了一个表。使用ajax调用(因此页面不必刷新)，当用户搜索、筛选等时，它使用控制器方法更新表(Partialview)中的条目。
在该表的部分视图之外，有一个"TotalHours“字段，该字段显示当前显示在该表中的劳动条目的总时数。
我最初在控制器方法中使用一个TempData变量来在每次应用过滤器或搜索时更新"TotalHours“字段，但出于某种原因，该表没有使用搜索/过滤的实体刷新。如果删除TempData变量，那么我创建的搜索/筛选函数就能很好地工作。
我的问题是，要更新正在刷新的部分视图之外的"TotalHours“字段，需要做什么？它由表中使用的对象列表中的“小时”变量之和计算。
控制器代码，尽管它没有更新视图中的部分视图，但仍然包含TempData变量：
[HttpPost]
public async Task<PartialViewResult> GetRows(Guid? cust, Guid? task, int? workType, int? weekFrom, int? weekTo, int? yearFrom, int? yearTo,
string startDate = "", string endDate = "", string search = "",string sortName = "", string sortDir = "")
{
var model = new List<TimeEntryViewModel>();
try
{
var timeRepo = new TimeRepository(_context);
var customerRepo = new CustomerRepository(_context);
var taskRepo = new TaskRepository(_context);
var user = await _userManager.GetUserAsync(User);
var entries = await timeRepo.GetTimeEntriesByUserID(user.Id);
DateTime startWeekYearDate;
DateTime endWeekYearDate;
int?[] weekYears = { weekFrom, weekTo, yearFrom, yearTo };
var entriesFiltered = entries.Where(r => r.CustomerID == cust || cust.Equals(Guid.Empty) || cust == null)
.Where(r => r.TaskID == task || cust.Equals(Guid.Empty) || task == null)
.Where(r => r.WorkTypeID == workType || workType == null || workType == 0)
.ToList();
if (weekYears.All(x => x.HasValue))
{
startWeekYearDate = new DateTime((int)yearFrom, 1, 1);
endWeekYearDate = new DateTime((int)yearTo, 1, 1);
startWeekYearDate = startWeekYearDate.AddDays(7 * (int)weekFrom).AddDays(-7);
endWeekYearDate = endWeekYearDate.AddDays(7 * (int)weekTo);
entriesFiltered = entriesFiltered.Where(r => r.Start >= startWeekYearDate)
.Where(r => r.End <= endWeekYearDate).ToList();
}
if (!string.IsNullOrEmpty(startDate))
{
entriesFiltered = entriesFiltered.Where(r => r.Start >= DateTime.Parse(startDate)).ToList();
}
if (!string.IsNullOrEmpty(endDate))
{
entriesFiltered = entriesFiltered.Where(r => r.End <= DateTime.Parse(endDate)).ToList();
}
foreach (var entry in entriesFiltered)
{
var entryVm = _mapper.Map<TimeEntryViewModel>(entry);
var customer = await customerRepo.GetCustomerByID(entry.CustomerID);
var task1 = await taskRepo.GetTaskById(entry.TaskID);
entryVm.Customer = customer;
entryVm.Task = task1;
entryVm.EmployeeName = user.FirstName + " " + user.LastName;
entryVm.CustomerName = customer.CustomerName;
entryVm.TaskName = task1.Name;
model.Add(entryVm);
}
if (!string.IsNullOrEmpty(search))
{
model = model.Where(r => r.EmployeeName.Contains(search)
|| r.CustomerName.Contains(search) || r.TaskName.Contains(search)).ToList();
}
model = TimeEntryViewModel.SortList(model, sortName, sortDir);
}
catch (Exception e)
{
_logger.LogError(e.Message, e);
}
var totalHours = 0.0;
foreach(var m in model)
{
totalHours += m.TotalHours;
}
TempData["Total"] = Math.Round(totalHours, 2);
return PartialView("_entryRows", model);
} PartialView cshtml：
@using TimeLogger.Core.Enums
@using TimeLogger.ViewModels
@model List<TimeEntryViewModel>
@foreach(var entry in Model)
{
<tr class="customRow">
<td>@entry.EmployeeName</td>
<td>@entry.Start</td>
<td>@entry.End</td>
<td>@entry.TotalHours</td>
<td>@entry.CustomerName</td>
<td>@entry.TaskName</td>
<td>@Enum.GetName(typeof(WorkType), entry.WorkTypeID)</td>
<td class="text-end">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown">
@*<i class="fa-solid fa-ellipsis-vertical">
</i>*@
</button>
<div class="dropdown-menu" id="dropDownMenu">
<a href="javascript:void(0);" class="dropdown-item editEntry" data-id="@entry.Id">Edit</a>
<a href="javascript:void(0);" class="dropdown-item deleteEntry" data-id="@entry.Id">Delete</a>
</div>
</td>
</tr>
}视图，该视图呈现部分视图：
@using TimeLogger.Core.Enums
@using TimeLogger.ViewModels
@model List<TimeEntryViewModel>
@{
ViewData["Title"] = "Time Entries";
}
<div id='modal-placeholder' class='modal'>
<div class="modal-dialog">
<div class="modal-content">
<div id='modal-placeholderContent'></div>
</div>
</div>
</div>
<div class="entries">
<div class="container mt-5 px-2">
<div class="mb-2 d-flex justify-content-between align-items-center">
<div class="position-relative">
<span class="position-absolute search"><i id="search" class="fa fa-search modal-custom"></i></span>
<input class="form-control w-100" placeholder="" id="searchBox">
</div>
<div class="position-relative">
<span id="totalHours" class="totalHours">Total Hours: @TempData["Total"]</span>
</div>
<div class="px-2">
<button class="btn btn-primary addEntry">Add Entry <i style="font-size: 1.25rem" class="fa fa-plus-circle fa-2"></i></button>
<button class="btn filter" onclick="toggleDiv('filters'); return false">Filters <i id="arrow" style="font-size: 1.25rem" class="fa fa-angle-down text-gray-dark bg-light-grey fa-2x"></i></button>
</div>
</div>
<div class="container" id="filters" style="display:none">
<div class="row">
<div class="col-sm text-white">
Customer: @Html.DropDownList("Customers", (IEnumerable<SelectListItem>)ViewBag.Customers, new { @class = "form-control", @id = "customerDropDown" })
</div>
<div class="col-sm text-white">
Task: @Html.DropDownList("Tasks", (IEnumerable<SelectListItem>)ViewBag.Tasks, new { @class = "form-control", @id = "tasksDropDown" })
</div>
<div class="col-sm text-white">
Work Type: @Html.DropDownList("WorkTypes", (IEnumerable<SelectListItem>)ViewBag.WorkTypes, new { @class = "form-control", @id = "workTypesDropDown" })
</div>
</div>
<div id="weeksYears">
<div class="row">
<div class="col-sm text-white">
From Week: @Html.DropDownList("WeekFrom", (IEnumerable<SelectListItem>)ViewBag.Weeks, new { @class = "form-control", @id = "weekFromDropDown" })
</div>
<div class="col-sm text-white">
To Week: @Html.DropDownList("WeekTo", (IEnumerable<SelectListItem>)ViewBag.Weeks, new { @class = "form-control", @id = "weekToDropDown" })
</div>
<div class="col-sm text-white">
From Year: @Html.DropDownList("YearFrom", (IEnumerable<SelectListItem>)ViewBag.Years, new { @class = "form-control", @id = "yearFromDropDown" })
</div>
<div class="col-sm text-white">
To Year: @Html.DropDownList("YearTo", (IEnumerable<SelectListItem>)ViewBag.Years, new { @class = "form-control", @id = "yearToDropDown" })
</div>
</div>
</div>
<div id="dates" style="display: none;">
<div class="row">
<div class="col-sm text-white">
<div id="date-picker1" class="md-form md-outline input-with-post-icon datepicker">
<label for="startDateFilter">Start Date</label>
<i class="fas fa-calendar input-prefix"></i>
<input placeholder="Select date" type="text" id="startDateFilter" class="form-control" disabled="disabled">
</div>
</div>
<div class="col-sm text-white">
<div id="date-picker2" class="md-form md-outline input-with-post-icon datepicker">
<label for="startDateFilter">End Date</label>
<i class="fas fa-calendar input-prefix"></i>
<input placeholder="Select date" type="text" id="endDateFilter" class="form-control" disabled="disabled">
</div>
</div>
</div>
</div>
<br/>
<div class="row">
<div class="col-sm text-white">
<button onclick="filter(); return false" class="btn btn-primary">Filter</button>
<button id="dateWeeksToggle" onclick="toggleDatesWeeks(); return false" class="btn btn-info">Filters for Dates</button>
</div>
<div class="col-sm text-white">
<button onclick="clearFilter(); return false" type="reset" class="btn btn-secondary">Clear Filters</button>
</div>
</div>
<br/>
<br/>
</div>
<div class="table-responsive">
<table class="table table-responsive table-borderless">
<thead>
<tr id="sort-row" class="bg-light">
<th id="e" order="desc">Employee</th>
<th id="st" order="desc">Start Time</th>
<th id="et" order="desc">End Time</th>
<th id="h" order="desc">Hours</th>
<th id="c" order="desc">Customer</th>
<th id="t" order="desc">Task</th>
<th id="wt" order="desc">Work Type</th>
<th></th>
</tr>
</thead>
<tbody id="searchFilterResult">
@await Html.PartialAsync("_entryRows", Model)
</tbody>
</table>
</div>
</div>
</div>回答 1
Stack Overflow用户
回答已采纳
发布于 2022-08-05 15:01:59
想到的一个简单的选项是向部分视图添加一个隐藏的输入，并将其值设置为TempData的总计数，然后在ajax中使用这个隐藏值来设置部分视图之外的值：
局部视图
....
<input type="hidden" id="hdnhourlytotal" value="@(TempData["total"] ?? 0)" />
@foreach(var entry in Model)
....ajax
success: function(data) {
//add view to DOM
....
//set the element outside of your partial using hidden input
const totalfromhidden = parseFloat(document.getElementById("hdnhourlytotal").value);
document.getElementById("totalHours").textContent = `Total Hours: ${totalfromhidden}`;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73251459
复制相关文章
相似问题
腾讯云开发者
