Изменение свойств viewmodel без вспышки страницы - PullRequest
0 голосов
/ 07 сентября 2011

Я надеялся, что смогу получить некоторые идеи по этому поводу:

Я пытаюсь создать на веб-сайте функцию «Показать больше результатов», над которой я работаю. В настоящее время существует список из десяти элементов, которые в настоящее время отображаются с использованием синтаксиса бритвы.

@foreach (Movie m in Model.MovieList)
{
   <li>
      @Html.RouteLink("Details", "Details", new { detailsId = m.Id }, new { @class = "hidden double-click-href" })
      <h1>
         @(m.CurrentIdentifier): @m.MovieTitle
         <span class="right">@m.Movie.Description</span>
       </h1>
         <div class="fields">
            <span class="label">Release Date</span>
            <span class="value">@m.CreatedOn.ToShortDateString()</span>
            <span class="label">Genre</span>
            <span class="value">@m.Genre.Name</span>
         </div>
   </li>
}

Существует ссылка «Показать дополнительные результаты», которая при нажатии добавит следующие 10 случаев в список с запросом. Единственный способ сделать это - создать вызов ajax с использованием JQuery, который будет вызывать действие, вернуть результаты JSON с необходимой мне информацией и заполнить строку, являющуюся «шаблоном» (дубликатом) HTML-кода. выше с использованием метода JavaScript.

Проблема в том, что мне не нравится тот факт, что HTML в основном дублируется, и если я пытаюсь заполнить свойство MovieList во время вызова действия (мне нужно сделать его ajax или что-то подобное, чтобы не было "мигает") не будет поднят, пока страница не обновится.

Есть ли хороший способ установить свойство MovieList, чтобы мне не приходилось дублировать HTML-код и по-прежнему выполнять вызов ajax (не возвращать страницу назад)?

Изменить:

Я попытался предложить @Jamie Dixon, и, хотя я вижу запрос и вижу, что возвращается правильный HTML-код, он не обновляет страницу (страница остается такой же, как и до того, как я щелкнул ссылку). Вот JavaScript:

 function GetMovieList() {
    var url = location.pathname + '/Filter';
    var size = $('#my-movie-list > li').size();

    $.ajax({
      type: "GET",
      url: url,
      data: { fromNumber: size }, //the number of rows already displayed
      contentType: "application/x-www-form-urlencoded",
      success: function (data) {
      SetShowMoreResultsFeatures(); //checks to see if the 'Show More Results' link should be disabled and some other stuff.
      }
    });
  }

Вот метод контроллера:

[Route("/Filter")]
public ActionResult GetFilteredMovies(int fromNumber)
{
  ViewData.Model = new DashboardIndexViewModel
  {
    CurrentUser = CurrentUser.User,
    MyCalendar = new CalendarListView(CurrentUser.User),
    CaseCount = movieQuery.Execute(CurrentUser.User.Id).Count(),
    Movies= GetMovies(fromNumber)
  };


  return View("_MovieItem", ViewData.Model);
}

и вот частичное представление "_MovieItem":

@model Matrix.Investigator.Website.ViewModels.Dashboard.DashboardIndexViewModel

@foreach (Movie m in Model.MovieList)
{
   <li>
      @Html.RouteLink("Details", "Details", new { detailsId = m.Id }, new { @class = "hidden double-click-href" })
      <h1>
         @(m.CurrentIdentifier): @m.MovieTitle
         <span class="right">@m.Movie.Description</span>
       </h1>
         <div class="fields">
            <span class="label">Release Date</span>
            <span class="value">@m.CreatedOn.ToShortDateString()</span>
            <span class="label">Genre</span>
            <span class="value">@m.Genre.Name</span>
         </div>
   </li>
}

1 Ответ

2 голосов
/ 07 сентября 2011

Поместите ваш HTML в частичное представление, которое перебирает коллекцию, чтобы вывести ее HTML.

Когда вы выполняете ajax-вызов для вашего метода контроллера, контроллер должен вернуть то же самое частичное представление и передать его вашей новой коллекции.

Затем вы можете просто перенести возвращенные данные HTML в соответствующую часть вашей страницы, и дублирования не будет.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...