【发布时间】：2020-11-28 03:02:41
【问题描述】：
我正在使用 ASP.NET Core 3.1 MVC 来构建我的应用程序。我有一个视图，它具有向父视图添加数据的模式形式的部分视图。我的模式有一个表格和选择按钮。我的目标是将模式中的选定文本附加到父视图中的文本框。
我正在使用 jQuery 来捕获和添加此信息，但我愿意接受其他建议（请不要添加插件）。
[索引]父视图：
@model MyApp.Models.Users
@{
ViewData["Title"] = "Index";
}
<div class="container">
<div class="row">
<form asp-action="Index" method="post">
<label asp-for="Qualifications"></label>
<input id="txtQualifications" asp-for="Qualifications" />
</form>
<!--Button trigger for Qualifications Modal-->
<button type="button" class="btn btn-primary" id="btnQualifications">Add Qualification</button>
<!--Div that displays the Qualifications Modal-->
<div class="modal fade" id="divQualifications" role="dialog" data-url="@Url.Action("_Qualifications", "Parent")"
</div>
</div>
@section Scripts{
<script type="text/javascript">
$(document).ready(function () {
//first I click the btn to open the Qualifications modal
$('#btnQualifications').click(function () {
var url = $('#divQualifications').data('url');
//using get to display the modal in the parent view div
$.get(url, function (data) {
$('#divQualifications').html(data);
$('#divQualifications').modal('show');
//At this point the modal is open and I want to select values from the table
//to append to the text box on the parent view
$('table button').on('click', function () {
//here I want to use my 'Select' button in my Partial View modal to append the text to the txtQualifications
//text box in the Parent View
});
});
});
});
</script>
}
[ParentController] 控制器（同时处理父视图和部分视图）：
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> Index()
{
//there's a query here that loads the view with data
return View(data)
}
//GET: Qualifications Modal (partial view)
public ActionResult _Qualifications()
{
//there's a query here that loads the view with data
return PartialView(data);
}
[_Qualifications]部分观点：
@model IEnumerable<MyApp.Models.Qualifications>
<div class="container">
<div class="row">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h4>Add Qualifications</h4>
</div>
<div class="modal-body">
<table>
<thead>
<tr>
<td>Select</td>
<td>
@Html.DisplayNameFor(model => model.Qualifications)
</td>
</tr>
</thead>
<tbody>
@foreach(var item in Model)
{
<tr>
<td>
<button class="btn btn-success">
@Html.HiddenFor(modelItem => item.Qualifications, new { id = item.Id})
</button>
</td>
<td id="tdQualification">
@Html.DisplayFor(modelItem => item.Qualifications)
</td>
</tr>
}
</tbody>
</table>
</div>
<div class="modal-footer">
<button>Close</button>
<button id="btnQualSave" type="button">Save Changes</button>
</div>
</div>
</div>
</div>
</div>
父模型
namespace MyApp.Models
{
public partial class Users
{
public int Id { get; set; }
public string Name { get; set; }
public string Qualifications { get; set; }
}
}
局部视图模型
namespace MyApp.Models
{
public partial class Qualifications
{
public int Id { get; set; }
public string Qualifications { get; set; }
}
}
随着用户获得更多技能，他们会从资格表中将资格添加到他们的记录中。我的目标是将模式中的选定文本附加到父视图中的文本框。到目前为止，当我尝试从模式中选择值时，我得到了不确定。
编辑：澄清一下，我希望在单击“选择”按钮后立即将文本附加到文本框中。暂时忽略保存按钮。 感谢您的帮助！
【问题讨论】：
-
我的回答有帮助吗？如果有，你能做到吗？
标签： jquery asp.net-core model-view-controller partial-views modalpopupextender