web-dev-qa-db-ja.com

asp.net mvc4で部分ビューを使用して検索機能を作成するにはどうすればよいですか？

最初にエンティティフレームワークモデルでASP.NETMVC4を使用しています。

「Masterpage.cshtml」に、テキストボックスとボタンを含む部分ビューが必要です。

検索ではアイテムのタイトルが検索されます。テキストにアイテムのタイトルが含まれている場合は、それらのアイテムが表示されます。

テキストが送信されると、@renderbody()はアイテムを含むビューを表示する必要があります。

私の質問は、どうすればこれを良い方法で行うことができるかということです。良い簡単なアプローチは何ですか？

これまで私はこれを行いました：

検索機能を実行するメソッドをリポジトリに作成しました。

public List<News> Search(string query)
        {

            var queryz =  db.News.Where(x => x.Title.Contains(query));
            return queryz.ToList();
        }

さて、私のSearchcontrollerに関しては、これを行う方法を少し失いました。 1つのactionresultは、文字列クエリパラメータを持つpartialviewである必要があり、もう1つはアイテムを表示するビューを含む必要があるためですか？

私が今やったことは、プロセス全体を同じアクション結果にすることです。

 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);
        }

どんな種類の助けも大歓迎です！

c#asp.netasp.net-mvcsearchactionresult
10
Obsivus

次のアプローチを使用できます。

Index.cshtml

検索コントローラーアクションを呼び出すDIVと、結果を表示するDIVを1つずつ用意します。

<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-resultsDIVに結果が表示されます。 UpdateTargetIdは、検索結果をsearch-resultsDIVに渡すことを指定します。

@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>      
}

コントローラでは、フォームを表示するための1つのアクション（上記の部分ビュー）と、検索クエリを処理して結果を表示する別の部分ビューを再調整するための別のアクションが必要です。

[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
    }
}
24
MattSull