Как сделать так, чтобы данные отображались фильтром на странице бритвы? - PullRequest
Новая
       8

Как сделать так, чтобы данные отображались фильтром на странице бритвы?

0 голосов
/ 07 апреля 2020

Часть представления, где я фильтрую его по категориям автомобилей: 

<div class="form-group">
  <select class="form-control" id="sel1">
     <option value="" disabled selected hidden>Car Styles</option>
         @foreach (var item in Model.CarCats)
            {
              <option value="@item.CarCategoryID">@item.CarCategoryName</option>
             }
         </select>
       </div>

Часть представления, где у меня есть автомобили: 

@foreach (var item in Model.Cars)
        {
                <div class="col-lg-4">
                    <div class="carGalleryWrapper">
                        <div class="carGallery" style="background:url('@Html.DisplayFor(modelItem=>item.ImagePath)') no-repeat 0 0 ">
                            <div class="carDetails">
                                <h4>@Html.DisplayFor(modelItem => item.DailyFee) / Per Day</h4>
                                <h3>@Html.DisplayFor(modelItem => item.Make) @Html.DisplayFor(modelItem => item.Model), Navi, Leather, ABS</h3>
                                <button type="submit" class="driveMore">
                                    @Html.ActionLink("Drive Now", "Detail", null, new { id = item.CarID }, htmlAttributes: new {})</button>
                            </div>
                        </div>
                    </div>
                </div>
            }

Я хочу показать автомобили категории, когда я выбираю ее из выпадающего списка.

1 Ответ

0 голосов
/ 07 апреля 2020

Существует несколько способов сделать это.

  1. Используйте форму и заполните новый список автомобилей. Серверная часть (сторона сервера) отправляет форму с выбранной категорией в вашем методе обработки. Ваша форма удалить автомобили из вашего списка, которые не имеют этой категории et c. Хорошим примером этого является здесь В методе, который использует модель вашей страницы (метод, который будет опубликован при отправке формы), именно здесь вы будете фильтровать свой список автомобилей по категориям. Затем верните ту же страницу. При этом не используется js, поэтому он всегда будет работать, даже если ваш пользователь отключил js в своем браузере, однако это не самый удобный способ для пользователя из-за перезагрузки страницы.

  2. Использование js, чтобы вызвать API, который принимает категорию и возвращает новый список автомобилей (на стороне клиента и сервера). Затем заново заполняйте ваш интерфейс новым списком. Мой js ни на что не годится, но грубая идея состоит в том, чтобы создать Контроллер API, который примет вашу категорию и вернет отфильтрованный список. посмотрите на этот ответ для начала здесь если вы посмотрите на успешный ответ на вызов ajax, он накапливает html, и это то, что вам нужно будет сделать с отфильтрованным списком, возвращаемым из API.

  3. Используйте js и css, чтобы скрыть / показать автомобили в зависимости от выбранной категории (на стороне клиента)

Был ли у вас предпочтение?

...