在ASP.NET MVC内核中以弹出模式显示搜索结果的最佳实践
在ASP.NET MVC内核中以弹出模式显示搜索结果的最佳实践
提问于 2020-10-09 03:00:48
我将一个值(搜索字符串)从表单传递到控制器操作方法，在该方法中，我执行一些活动从db中查找特定记录，然后将结果传递给ViewBag或模型，以便在视图中显示结果。
简单的方法是将结果作为模型(或视图模型)传递给视图。类似于：
1-将字符串从窗体传递给控制器。
2-在控制器、方法中，在执行搜索并将其保存到list/var之后。
返回视图(我的模型)；
3-在视野中..。我们可以说
@foreach (模型中的var项){.表来显示列和data..etc。}
问题是，与视图不同，我如何在模态弹出中显示结果？
对于许多不同的JQuery或JavaScripts，有这么多建议，但有没有更简单的解决方案？
有什么东西像(简单地)在弹出模式中显示视图吗？
提前感谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-10-09 03:32:23
，有什么东西像(简单地)在弹出模式中显示视图吗？
我认为在模态弹出中显示结果的最简单的方法是使用部分视图和ajax。
在这里，您不能避免创建一个视图来存储需要在模式弹出窗口中显示的内容。当然，您只需要创建一个部分视图，而不是一个视图。
下面是一个供您参考的简单演示：
主要观点：
更新：
@{
ViewData["Title"] = "Testpop";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h1>Testpop</h1>
<form>
<input id="Text1" type="text" />
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal" id="showPop">Open Modal</button>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body ">
<div id="popup">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal" id="submitModal">Submit</button>
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</form>
@section Scripts{
<script>
$('#showPop').click(function () {
var url = '@Url.Action("GetPartialView", "Default")';
$.ajax({
url: url,
type: 'post',
data: { "para": $("#Text1").val()},
success: function (data) {
$('#popup').html(data);
}
});
})
$('#submitModal').click(function () {
var url = '@Url.Action("GetData", "Default")';
$.ajax({
url: url,
type: 'post',
data: { "data": $("input[name='data']").val() },
success: function () {
$("#Text1").val("");
alert("pass successfully!");
}
});
});
</script>
}默认/GetPartialView操作：
[HttpPost]
public IActionResult GetPartialView(string para)
{
//get data
var model = _context.Person.Where(x=>x.Name == para).ToList();
return PartialView("_PopView",model);
}_PopView.cshtml部分视图：
@model IEnumerable<Person>
<table class="table table-bordered">
<tr>
<td>Id</td>
<td>Name</td>
<td>Nome_Tipo</td>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@item.Id
</td>
<td>
@item.Name
</td>
<td>
@item.Nome_Tipo
</td>
</tr>
}
</table>
<input id="data" type="text" name="data" />弹出向操作提交数据：
[HttpPost]
public IActionResult GetData(string data)
{
//do anything.
return Ok();
}以下是新的结果：
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/64273342
复制相关文章
相似问题
腾讯云开发者
