Sathish km Ответов: 1

Как отобразить две строки записи в itemtemplate in ASP.NET?


Я хочу отобразить два изображения бок о бок, используя шаблон элемента в ретрансляторе.
Изображения получают в виде коллекции списков из самой папки решения. Теперь я получаю только одно изображение за раз.

Что я уже пробовал:

&ЛТ;АСП:репитер идентификатор="rptSlides" атрибут runat="сервер"и GT;
& lt;itemtemplate>

&ЛТ;ИМГ СРЦ='&л;%# DataBinder.Ивала(Контейнер.DataItem," Value") % & gt;' class= "img-responsive" alt=" "style=" width: 348px;
высота: 188px">







С#:

string[] filePaths = каталог.GetFiles (Сервер.MapPath ("~/MyImages/"));
Список<listitem элемент&ГТ; файлы = новый список<listitem элемент&ГТ;();
по каждому элементу (строка FilePath в пути к каталогам)
{
строка файла = путь.GetFileName(путь_к_файлу);
файлы.Add(new ListItem(fileName, "MyImages/" + fileName));
}
rptSlides.Источник данных = файлы;
rptSlides.Привязку();

Karthik_Mahalingam

разместите полную разметку ретранслятора.

Sathish km

&ЛТ;форме ID="форма form1" атрибут runat="сервер"и GT;
< div>

<div class= "thumbnail">

&ЛТ;див ИД="DemoCarousel" класс="карусель слайд" данные-интервал="2000" данные-прокатит="карусели"&ГТ;
&ЛТ;АСП:репитер идентификатор="rptMain" атрибут runat="сервер" OnItemDataBound="OnItemDataBound"&ГТ;
& lt;itemtemplate>
< ol class= "карусель-индикаторы">
&ЛТ;АСП:репитер идентификатор="rptIndicators" атрибут runat="сервер"и GT;
& lt;itemtemplate>
в <данные-целевой батарея Li="#DemoCarousel" данные-слайд-к=в'<% контейнер.ItemIndex%> 'class=' & lt;%# Container.ItemIndex == 0 ? "активный": "" %>'>
<%-- & lt;%# контейнер.ItemIndex% & gt;--%>
< / li>


< / ol>
< div class= "carousel-inner">
&ЛТ;АСП:репитер идентификатор="rptSlides" атрибут runat="сервер"и GT;
& lt;itemtemplate>
контейнер <div & lt;%#.ItemIndex == 0 ? "класс=\"активный элемент\"" : "класс=\"\ пункт"" %&ГТ;&ГТ;
< div class= "carousel-caption">
&ЛТ;%-- &ЛТ;ИМГ СРЦ='&л;%# DataBinder.Ивала(Контейнер.Элемента данных,"значение") %&ГТ;' класс="ИМГ-отзывчивый" АЛТ="" стиль="ширина: 300 пикселей;
высота: 388px">
&ЛТ;ИМГ СРЦ='&л;%# DataBinder.Ивала(Контейнер.Элемента данных,"значение") %&ГТ;' класс="ИМГ-отзывчивый" АЛТ="" стиль="ширина: 300 пикселей;
высота: 388px">--%>
<%-- & lt;img src='http://moss2013-dev/EIP2010/FAS/InternalDocuments/LE_SZ000010_FPI_12_INR_0000122nature-wallpapers-hd-9.jpg' />--%>

&ЛТ;ИМГ СРЦ='&л;%# DataBinder.Ивала(Контейнер.Элемента данных,"значение") %&ГТ;' /&ГТ;

< / div>
< / div>



< / div>



&ЛТ;промежуток класс="glyphicon glyphicon-шеврон-слева" Ария-скрытые="истинный"&ГТ;&ЛТ;/службы&ГТ;&ЛТ;промежуток класс="СР-только"&ГТ;предыдущий&ЛТ;/службы&ГТ;
&ЛТ;промежуток класс="glyphicon glyphicon-шеврон-право" Ария-скрытые="истинный"&ГТ;&ЛТ;/службы&ГТ;&ЛТ;промежуток класс="СР-только"и GT;далее&ЛТ;/службы&ГТ;
< / div>
< / div>
< / div>
< / форма>

1 Ответов

Рейтинг:
5

F-ES Sitecore

Это скорее вопрос css, но вы должны добавить соответствующие стили\классы к своему изображению. Если вы загуглите, как разложить вещи в сетку, вы найдете лучшие учебники, но это основной способ сделать это

<asp:Repeater id="rptSlides" runat="server" OnItemDataBound="rptSlides_ItemDataBound">
    <HeaderTemplate>
        <div>
    </HeaderTemplate>
    <ItemTemplate>
        <asp:Image ID="myImage" runat="server" ImageUrl='<%#Eval("ImageUrl") %>' />
    </ItemTemplate>
    <FooterTemplate>
        </div>
    </FooterTemplate>	
</asp:Repeater>


protected void Page_Load(object sender, EventArgs e)
{
    rptSlides.DataSource = new List<MyData> {
        new MyData { ImageUrl = "~/Images/pic1.png" },
        new MyData { ImageUrl = "~/Images/pic2.png" },
        new MyData { ImageUrl = "~/Images/pic3.png" },
        new MyData { ImageUrl = "~/Images/pic4.png" },
        new MyData { ImageUrl = "~/Images/pic5.png" }
    };

    rptSlides.DataBind();
}

protected void rptSlides_ItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        Image myImage = (Image)e.Item.FindControl("myImage");

        // make image float left
        myImage.Style["float"] = "left";

        if (e.Item.ItemIndex % 2 == 0)
        {
            // item index is even so break the floating left
            myImage.Style["clear"] = "both";
        }
    }
}