2016-04-15 5 views
1

Я пытаюсь установить background-image из div в ItemTemplate из DataList к имени файла в column image_path в datatable, который используется в качестве источника данных в ListView в.background-image не отображается в div внутри DataList ItemTemplate?

Вот код, который я использую сейчас, который включает в себя два datalists. Он основан на коде найден здесь: background-image eval

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TestWebApp.Default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:DataList ID="DataListDiv" runat="server" RepeatColumns="5"> 
      <ItemTemplate> 
       <asp:Label ID="Label1" runat="server" Text="My lagel"></asp:Label> 
       <div style='width:195px;height:162px;background-position:center;background-image:url(<%# Eval("image_path","~/Styles/Images/{0}") %>)'></div> 
      </ItemTemplate> 
     </asp:DataList> 

    <asp:DataList ID="DataListImages" runat="server" RepeatColumns="5"> 
      <ItemTemplate> 
       <asp:ImageButton ID="ImageButton2" ImageUrl='<%# Eval("image_path","~/Styles/Images/{0}")%>' runat="server" /> 
      </ItemTemplate> 
    </asp:DataList> 



    </div> 
    </form> 
</body> 
</html> 

Проблема заключается в том, что DataListDiv не отображается. Отображается второй datalist (DataListImages), но он использует ImageButton. Оба используют тот же eval, поэтому я знаю, что привязка правильная.

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

BedNum  Waiter  image_path 
201  Joe  Red.png 
202  Jim  Green.png 
203  Mary  Red.png 
204  Carl  Yellow.png 
+0

Когда я проверить код , изображение всегда отображается. Если вы добавляете ярлыки или текстовые поля в «ItemTemplate' из« DataListDiv », чтобы показать значение других полей, вы видите их? – ConnorsFan

+0

Да, я вижу ярлык, но я не вижу изображения. Вы видите обоих изображений с изображениями? – rbhat

+0

Я разместил все html. Может, в другом месте что-то не так? – rbhat

ответ

0

Я в конечном итоге изменения относительного пути в background-image:url для div, устраняя ~/:

<asp:DataList ID="DataListDiv" runat="server" RepeatColumns="5"> 
    <ItemTemplate> 
     <div style='width:195px;height:162px;background-position:center;background-image:url(<%# Eval("image_path","Styles/Images/{0}") %>)'></div> 
    </ItemTemplate> 
</asp:DataList>