我首先使用ASP.NET MVC 4和实体框架模型。
在我的“Masterpage.cshtml”中,我想要一个包含文本框和按钮的局部视图。
搜索正在查找项目标题,如果文本包含项目标题,则应显示这些项目。
提交文字后,@renderbody()
应显示包含项目的视图。
我的问题是如何以良好的方式做到这一点?什么是一个好的和简单的方法?
到目前为止,我已经这样做了:
在我的存储库中创建了一个执行搜索功能的方法:
public List<News> Search(string query)
{
var queryz = db.News.Where(x => x.Title.Contains(query));
return queryz.ToList();
}
现在谈到我的Searchcontroller,我有点失去了如何做到这一点。因为一个actionresult需要是具有字符串查询参数的partialview和包含将显示项目的视图的其他参数吗?
我现在所做的是让整个过程处于相同的行动结果:
Repository rep = new Repository();
[HttpPost]
public ActionResult Search(string query)
{
var searchlist = rep.Search(query);
var model = new ItemViewModel()
{
NewsList = new List<NewsViewModel>()
};
foreach (var NewsItems in searchlist)
{
FillProductToModel(model, NewsItems);
}
return View(model);
}
private void FillProductToModel(ItemViewModel model, News news)
{
var productViewModel = new NewsViewModel
{
Description = news.Description,
NewsId = news.Id,
Title = news.Title,
link = news.Link,
Imageurl = news.Image,
PubDate = news.Date,
};
model.NewsList.Add(productViewModel);
}
任何形式的帮助都很受欢迎!
答案 0 :(得分:24)
您可以使用以下方法:
<强> Index.cshtml 强>
让一个DIV调用搜索控制器操作,另一个DIV显示结果。
<div id="search-form">
@Html.Action("Search", "Home"); // GET action in controller that displays form
</div>
<div id="search-results">
</div>
<强> _SearchFormPartial.cshtml 强>
创建一个包含搜索表单的部分视图。您可以使用Ajax.BeginForm
,因此当用户搜索结果时,结果将显示在AJAX的Index.cshtml中的search-results
DIV中。 UpdateTargetId
指定我们要将搜索结果传递给search-results
DIV。
@using (Ajax.BeginForm("Search", "Home", FormMethod.Post,
new AjaxOptions
{
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
UpdateTargetId = "search-results"
}))
{
<div>
@Html.TextBox("query")
<input type="submit" value="Search" />
</div>
}
在你的控制器中,你需要一个动作来显示表格(上面的局部视图),另一个动作来处理搜索查询并重新调整另一个显示结果的局部视图:
[HttpGet]
public ActionResult Search()
{
return PartialView("_SearchFormPartial");
}
[HttpPost]
public ActionResult Search(string query)
{
if(query != null)
{
try
{
var searchlist = rep.Search(query);
var model = new ItemViewModel()
{
NewsList = new List<NewsViewModel>()
};
return PartialView("_SearchResultsPartial", model);
}
catch (Exception e)
{
// handle exception
}
}
return PartialView("Error");
}
<强> _SearchResultsPartial.cshtml 强>
此部分将显示结果。它是强类型的ItemViewModel
。
@model Namespace.ViewModels.ItemViewModel
@if (Model.SearchResults.Count == 0)
{
<h3 class="text-error">No items matched your search query!</h3>
}
else
{
foreach (var result in Model.NewsList)
{
// display search results
}
}
答案 1 :(得分:0)
如果你的 _SearchResultsPartial.cshtml 没有插入给定 ID 的 DOM 元素,你应该添加一个脚本:query.unobtrusive-ajax.js
它在我的情况下修复了 MattSull 的解决方案