asp.net MVCの部分ビューで検索機能を作成するにはどうすればいいですか？

Question

まず、エンティティフレームワークモデルでASP.NET MVC 4を使用しています。

私の "Masterpage.cshtml"には、テキストボックスとボタンを含む部分的なビューが必要です。

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

テキストを送信すると、@renderbody()にはアイテムが表示されます。

私の質問は、どうすればいいですか？良いと簡単なアプローチは何ですか？

は、これまでのところ、私はこれを行っている：それはちょっとこれを行う方法を失った私のSearchcontrollerイムに来る今とき

public List<News> Search(string query) 
     { 

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

：

は、検索機能を実行し、私のリポジトリ内のメソッドを作成しました。 1つのアクション結果は、文字列クエリパラメータを持つpartialviewである必要があり、アイテムを表示するビューを含む他のビューである必要がありますか？

私が今行っていることは同じのActionResultに全体のプロセスを持っている：

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

ヘルプのいずれかの種類がたくさん歓迎です！

Answer 1

あなたは、次のアプローチを使用することができます。

Index.cshtml

つの検索コントローラのアクションを呼び出し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>  
} 

フォーム（上記の部分図）と検索クエリを処理し、結果を表示します別の部分図をretunするために別のものを表示するには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 
    } 
}