Как загрузить частичный вид на изображение клик - PullRequest
Новая
       26

Как загрузить частичный вид на изображение клик

0 голосов
/ 30 марта 2019

Я хочу отобразить карусель изображений, когда пользователь нажимает на само изображение. В этот момент должна быть загружена карусель со всеми изображениями в галерее. У меня есть частичное представление, которое содержит HTML-код, необходимый для карусели.

Я попытался загрузить представление как частичное на <a href"">, и я также попытался загрузить его в <a target="">. Оба не сработали. Они загружают частичное, но оно загружается, когда галерея отображается, а не после события щелчка.

Текущие модели Mij: 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using umbraco;
using Umbraco.Core.Models;
using Umbraco.Web;

namespace NameSpace.Models
{

    public class Carousel
    {
        public List<Photo> PhotoList { get; set; }

        public Carousel(IPublishedContent content)
        {
            PhotoList = content.Children().Select(c => new Photo(c)).OrderByDescending(n => n.Date).ToList();
        }
    }
}

using System;
using System.Collections.Generic;
using System.Globalization;
using System.Linq;
using System.Web;
using Umbraco.Core.Models;
using Umbraco.Web;

namespace NameSpace.Models
{
    public class PhotoGallarypageRenderModel : BaseRenderModel
    {
        public string Name { get; set; }
        public IEnumerable<IPublishedContent> MediaGallary { get; set; }
        public string AlbumName { get; set; }
        public Carousel Carousel { get; set; }

        public PhotoGallarypageRenderModel(IPublishedContent content, CultureInfo culture) : base(content, culture)
        {
            Name = content.Name;
            MediaGallary = content.GetPropertyValue<IEnumerable<IPublishedContent>>("PhotoPicker");
            AlbumName = content.GetPropertyValue<string>("AlbumName");
            Carousel = new Carousel(content);
        }
    }
}

Вид выглядит следующим образом: 

@inherits UmbracoViewPage<NameSpace.Models.PhotoGallarypageRenderModel>
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<div class="container">
    <h1 class="font-weight-light text-center text-lg-left mt-4 mb-0">Thumbnail Gallery</h1>
    <hr class="mt-2 mb-5">
    <div class="row text-center text-lg-left">
        @foreach (var item in Model.MediaGallary)
        {
            <div class="col-lg-3 col-md-4 col-6">
                <a href="/nl/fotografie/@Model.AlbumName/@item.Id" target="_blank" class="d-block mb-4 h-100">
                    <img class="img-fluid img-thumbnail" src="@item.GetCropUrl("gallaryThumbnail")" alt="Gallary photo">
                </a>
            </div>
        }
    </div>
</div>

Поэтому, когда изображение нажимается, я бы хотел громко отобразить карусель с выбранным изображением в качестве первого.

Я бы не хотел использовать JavaScript, поскольку не знаю, как его использовать.

...