【发布时间】:2020-01-14 07:05:16
【问题描述】:
我有一个如下 C# ASP.NET MVC 的剃刀视图。此视图每天填充银行帐户交易的摘要行。用户可以单击每一行来查看每一天的详细信息。当用户单击每一行时,会出现一个模式,然后用户选择查看有关付款或接收的详细信息。
我的问题是在模式中查看这些详细信息的链接与用户单击的日期有关,因此我需要在模式出现时生成链接,并且在服务器端呈现视图之前不知道该链接。
我知道我可以使用 jQuery 和 ajax 来处理这种情况,但由于我对前端一无所知,所以我不知道如何处理这种情况。
@model IEnumerable<WebApplication1.Models.BankAccountDailySummary>
@{
ViewBag.Title = "BankAccountDailySummary";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<div id="wrapper">
<!-- Content Wrapper -->
<div id="content-wrapper" class="d-flex flex-column fadeInRight animated faster">
<!-- Main Content -->
<div id="content">
<!-- Topbar -->
<div class=" sticky-top ios-content-box-header p-1">
<nav class="topbar container-fluid pr-16p">
<div class="row font-12 " style="height: 45px">
<div class="col-3 text-right m-auto color-orange pl-1 pr-1"></div>
<div class="col-6 px-1 text-center m-auto text-gray-900 f-w-600 text-overflow-dot">@ViewBag.accountName</div>
<div class="col-3 text-left m-auto color-orange pr-1 pl-1"><a href="bank.html" class="ios-nav-link"> return<i class="fas fa-chevron-left fa-fw mr-1 color-orange"></i></a></div>
</div>
</nav>
</div>
<!-- End of Topbar -->
<!-- Begin Page Content -->
<div class="container-fluid px-0 head-foot-margin min-h-content">
<!-- Page Heading -->
<form class="user" action="">
<span class="col-12 text-gray-900 font-12 d-inline-block px-4 pb-2 ">Time interval</span>
<div class="ios-content-box px-4 py-3 mb-3 sticky-top" style="top:49px">
<div class="row ">
<a href="#" class="col-1 p-0"><i class="fas fa-search fa-fw m-auto d-block text-gray-500 pt-2"></i></a>
<div class="form-group float-right col-4 input-style-1">
<input title="" id="dateValue_1" type="text" class="example1 form-control form-control-user d-inline" />
</div>
<a onclick="clearValue('dateValue_1')" class="col-1 p-0"><i class="fas fa-trash-alt fa-fw m-auto d-block text-gray-500 pt-2"></i></a>
<div class="form-group float-right col-4 input-style-1">
<input title="" id="dateValue_2" type="text" class="example1 form-control form-control-user d-inline" />
</div>
<a onclick="clearValue('dateValue_2')" class="col-1 p-0"><i class="fas fa-trash-alt fa-fw m-auto d-block text-gray-500 pt-2"></i></a>
</div>
</div>
@if (Model != null)
{
foreach (var item in Model)
{
<a href="#" data-toggle="modal" data-target="#exampleModal" date =" @item.Date">
<div class="ios-content-box px-4 py-1 mb-3 ios-hover-box">
<div class="row font-12 my-2 ios-divider-line">
<div class="col-10 f-w-600 color-orange text-right">@ViewBag.accountName</div>
<div class="col-2 text-left"> <i class="fas fa-chevron-left fa-fw color-orange "></i></div>
</div>
<div class="row font-12 my-2 ios-divider-line">
<div class="col-6 text-gray-600 text-right">Receptions</div>
<div class="col-6 text-gray-600 text-left digit_divider">@Html.DisplayFor(modelItem => item.TotalPayment)</div>
</div>
<div class="row font-12 my-2 ios-divider-line">
<div class="col-6 text-gray-600 text-right">Payments</div>
<div class="col-6 text-gray-600 text-left digit_divider">@Html.DisplayFor(modelItem => item.TotalReception)</div>
</div>
<div class="row font-12 my-2 ios-divider-line">
<div class="col-6 text-gray-600 text-right">Remaining</div>
<div class="col-6 text-gray-900 f-w-600 text-left digit_divider">>@Html.DisplayFor(modelItem => item.Remain)</div>
</div>
</div>
</a>
}@*foreach item*@
}@*if model was not null*@
</form>
</div>
<!-- /.container -->
<div class=" sticky-top ios-content-box-footer p-1" style="bottom: 0">
<nav class="bottom-bar container-fluid pr-15p" style="height: 40px;">
<div class="row font-12 " style="height: 40px">
<div class="col-6 text-right m-auto text-gray-900">Total items found: </div>
<div class="col-6 d-inline m-auto color-orange text-left">@ViewBag.itemCount</div>
</div>
</nav>
</div>
</div>
<!-- End of Main Content -->
</div>
<!-- End of Content Wrapper -->
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" style="padding-top: 50%">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header border-0 ">
<button type="button" class="close" data-dismiss="modal" aria-label="Close" style="z-index: 10">
<span aria-hidden="true">×</span>
</button>
<h5 class="modal-title modal-title-ios font-13 f-w-600 text-gray-900">Select Type of Report:</h5>
</div>
<div class="modal-body">
<div class=" w-100 " style="overflow: auto">
<div class="row justify-content-center m-0">
<div class=" col-6 col-sm-4 text-center mb-2"><a href="@Url.Action("BankAccountDailyDeatils","Banks",new {accountId = @ViewBag.accountID,date= "dateReadFromROW", isPayment=true, accountName= ViewBag.accountName})" class="ios-nav-link text-gray-900"><div class=" bg-white border shadow-sm border-radius-10 home-items p-3"><img src="~/assets/icons/debit-card.svg" class="max-w-55 m-auto"><div class="font-12 mt-2">Payments</div></div></a></div>
<div class=" col-6 col-sm-4 text-center mb-2"><a href="@Url.Action("BankAccountDailyDeatils","Banks",new {accountId = @ViewBag.accountID,date= "dateReadFromROW",isPayment=false, accountName= ViewBag.accountName})" class="ios-nav-link text-gray-900"><div class=" bg-white border shadow-sm border-radius-10 home-items p-3"><img src="~/assets/icons/income.svg" class="max-w-55 m-auto"><div class="font-12 mt-2">Receptions</div></div></a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End of Page Wrapper -->
【问题讨论】:
标签: c# jquery ajax asp.net-mvc