Come posso creare una funzionalità di ricerca con vista parziale in asp.net mvc 4

Question

Sto usando ASP.NET MVC 4 con il modello di struttura di entità prima.

Nel mio "Masterpage.cshtml" voglio avere una vista parziale che contenga una casella di testo e un pulsante.

La ricerca sta cercando il titolo degli articoli, se il testo contiene un titolo di articoli deve visualizzare tali elementi.

Quando viene inviato un testo, lo @renderbody() dovrebbe mostrare una vista con gli articoli.

La mia domanda è come posso fare questo in un buon modo? che cosa è un approccio buono e facile?

Finora ho fatto questo:

Creato un metodo nel mio repository che fa la funzione di ricerca:

public List<News> Search(string query) 
     { 

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

Ora, quando si tratta di mio Searchcontroller im po 'perso come fare questo. Beacuse one actionresult deve essere la partialview che ha un parametro di query stringa e l'altro che contiene una vista che visualizzerà gli elementi?

Quello che ho fatto in questo momento sta avendo l'intero processo in stesso ActionResult: alot

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

qualsiasi tipo di aiuto è apprezzato!

Answer 1

è possibile utilizzare il seguente approccio:

Index.cshtml

Avere un DIV che chiama l'azione di controllo di ricerca, e un altro che sarà visualizzare i risultati.

<div id="search-form"> 
    @Html.Action("Search", "Home"); // GET action in controller that displays form 
</div> 
<div id="search-results"> 
</div> 

_SearchFormPartial.cshtml

Creare una vista parziale che ti contengono il modulo di ricerca. È possibile utilizzare Ajax.BeginForm in modo che quando un utente cerca i risultati verranno visualizzati nel DIV search-results in Index.cshtml da AJAX. UpdateTargetId specifica che vogliamo passare i risultati della ricerca al DIV search-results.

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

nel controller è necessario un'azione per visualizzare il modulo (vista parziale sopra) e un altro per elaborare la query di ricerca e Retun un'altra vista parziale che ti visualizzare i risultati:

[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

Questo parziale mostrerà i risultati. È fortemente digitato in un 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 
    } 
}