0

Я новичок в ASP.NET MVC. Я только что создал классическое приложение MVCMovie. Теперь я хотел бы добавить дополнительные функции, только для учебы. Я сделал "SearchByGen" Просмотр для поиска фильмов по жанрам: в представлении есть раскрывающийся список жанров и место DIV. Содержимое заполнителя загружается jQuery PartialView "SearchByGenGetResult", и все работает нормально.Маршрут-карта PartialView from View и ajax

Вопросов:

  1. Это архитектура правильно?

  2. Как можно сопоставить значения PartialView в URL, вызвав View (напр., Если при поиске "horror" по выбору DropDown Я хотел бы видеть в URL-то вроде "SearchByGen/horror", и я хотел бы чтобы правильно видеть результат и возможность DropDown выбранный доступ к странице с помощью "SearchByGen/horror")

Спасибо всем, теперь код:

Controller код:

public ActionResult SearchByGen() 
    { 
     //get the genres list 
     var totalGens = _repository.GetGenrs(); 

     //put into List<SelectListItem> for @Dropdown it 
     List<SelectListItem> items = totalGens.Select(genere => new SelectListItem { Text = genere, Value = genere }).ToList(); 

     //passing to the View 
     ViewBag.TotalGen = items; 

     return View(); 
    } 

    public ActionResult SearchByGenGetResult(string gen) 
    { 
     //select movies by gen 
     var moviesByGen = _repository.GetByGen(gen); 

     //render partial view 
     return PartialView(moviesByGen); 
    } 

Посмотреть SearchByGen

@model IEnumerable<MvcMovies.Models.Movie> 
@{ 
    ViewBag.Title = "Search By Gen"; 
} 

<script src="@Url.Content("~/Scripts/jquery-1.7.1.js")" type="text/javascript"></script> 

<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.js")" type="text/javascript"></script> 

<link href="@Url.Content("~/content/themes/base/jquery-ui.css")" rel="Stylesheet" type="text/css" /> 

<script type="text/javascript"> 

$(document).ready(
    function() { 

     var dropDownSelectedDefault = $("#TotalGen option:selected").text(); 
     $("#viewPlaceHolder").load("/Movie/SearchByGenGetResult", { gen: dropDownSelectedDefault }); 

     //$("input#search").click(
     $("#TotalGen").change(
      function() { 
       var dropDownSelected = $("#TotalGen option:selected").text(); 
       $("#viewPlaceHolder").load("/Movie/SearchByGenGetResult", { gen: dropDownSelected }); 
      } 
     ); 
    } 
);  
</script> 
<h2>Search By Gen</h2> 
<div> 
@Html.DisplayName("Genere ") 
@Html.DropDownList("TotalGen") 
</div> 
<div id="viewPlaceHolder"></div> 

Частичный вид SearchByGenGetResult (не показан классический подмости-лист View)

ответ

0

Вы можете сделать это, используя форму с FormMethod.Get так, что генерируется правильный URL (и добавлен в историю браузера). Вам нужно всего лишь один метод, и вы должны использовать модель представления, чтобы представить то, что вы хотите отобразить в представлении

public class MovieVM 
{ 
    public string Genre { get; set; } 
    public SelectList GenreList { get; set; } 
    public IEnumerable<Movie> Movies { get; set; } 
} 

public ActionResult Index(string genre) 
{ 
    var genreList = _repository.GetGenrs(); // assume this returns IEnumerable<string> 
    genre = genre ?? genreList.First(); 
    MovieVM model = new MovieVM 
    { 
    Genre = genre, 
    GenreList = new SelectList(genreList), 
    Movies = _repository.GetByGen(genre) 
    }; 
    return View(model) 
} 

@model MovieVM 
.... 
@using (Html.BeginForm("Index", "Movie", FormMethod.Get)) 
{ 
    @Html.LabelFor(m => m.Genre) 
    @Html.DropDownListFor(m => m.Genre, Model.GenreList) 
    <input type="submit" value="Search" /> 
} 
<div id="movies"> 
    @foreach (var movie in Model.Movies) 
    { 
    .... 
    } 
</div> 

В качестве альтернативы, если вы хотите использовать Ajax (там, вероятно, не много пользы производительности, поскольку основная часть HTML в списке фильмов), вам необходимо будет использовать History.js или аналогичный плагин, как описано в this answer и связанные с ним ссылки

+0

спасибо! Я изучу ваше решение. – DanB

0

во-первых,

Architecture can be change to your project But you can look these title; 
  1. Что такое Antiforgerytoken? (пример здесь: include antiforgerytoken in ajax post ASP.NET MVC)
  2. Что такое Bundling?
  3. Вы также можете посмотреть этот пример (include antiforgerytoken in ajax post ASP.NET MVC)

Второй вопрос ответа;

public PartialViewResult SearchByGenGetResult(string gen) 
{ 
    //select movies by gen 
    var moviesByGen = _repository.GetByGen(gen); 

    //render partial view 
    return PartialView(moviesByGen); 
} 

Просмотреть сценарий;

var dropDownSelected = $("#TotalGen option:selected").text(); 
    var url = '@Url.Action("SearchByGenGetResult", "Home")/' + dropDownSelected ; 
    $('#viewPlaceHolder').load(url); 

Пример здесь: (Render Partial View Using jQuery in ASP.NET MVC)

+0

спасибо! Я прочитаю предлагаемые названия – DanB