Question

我的网页中有一个表格，我希望在row1中显示我的图片，并在row1中显示图片的详细信息。调用图像时，我将图像的细节添加到列表中。有27行图像，9行表格。图像准备好后，我开始显示它的细节，它们存储在列表中。

<% 
    if (Model.Item.Count() < 1) return;

    int iIntialColum = 3;//set number of column per table 

    if (Model.Item.Count < 3)
        iIntialColum = Model.Item.Count();    

    int iNumCollum = iIntialColum; //further use  

    int iNumRow = 0;
    int iLastRow = 0;

    iNumRow = (Model.Item.Count() / iNumCollum);//find number of row to interate
    iLastRow = (Model.Item.Count() % iNumCollum);//find last row if exist

    if(iLastRow > 0)
        iNumRow += 1;

    int iStartIndex = 0;    
%>

<div class="productlist">
    <table cellpadding="0" cellspacing="0" width="100%" class="productlist"   style="margin-left:7px;">

    <% 
        List<Item> list = new List<Item>();
        for(int j = 0; j < iNumRow; j++) { %>
            <tr style="margin-left:20px;">       
                <% for(int i = iStartIndex; i < iNumCollum; i++) {
                    string _linke = "";

                    if(string.IsNullOrEmpty(Request.QueryString["ws"])) {
                        _linke = Url.Action(Model.ActionName, Model.ControllerName, 
                            new { 
                                id = Model.Item[i].ID, 
                                dep = Model.Item[i].DepartmentID, 
                                cat = Model.Item[i].CategoryID, 
                                tab = Model.Tab 
                            }
                        );                    
                    }
                    else {
                        _linke = Url.Action(Model.ActionName, Model.ControllerName, 
                            new { 
                                id = Model.Item[i].ID, 
                                dep = Model.Item[i].DepartmentID, 
                                cat = Model.Item[i].CategoryID, 
                                tab = Model.Tab, 
                                ws = Request.QueryString["ws"].ToString() 
                            }
                        );
                    } %>

                    <td align="left" valign="top" style="padding-left:0px; padding-top:0px; border:1px dotted #CCCCCC; ">
                        <div style="width:200px; text-align:center;margin-left:7px; height:auto;" class="border-listing-product"> 
                            <% if ((Model.Item[i].Brand.IsAuthorized == true) && ((HelperClass.ICEContact.PathBrandImages+ Model.Item[i].Brand.Image)!= null)) { %>
                                <div style="text-align:right; padding-right:15px; padding-top:5px;height:35px;">
                                    <img src="<%:HelperClass.CheckImageUrlExist(HelperClass.ICEContact.PathBrandImages+ Model.Item[i].Brand.Image)%>" width = "85px"/>
                                </div>      
                            <%}
                            else {%>
                                <div style="text-align:right; padding-right:15px; padding-top:5px; height:35px;">
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                </div>
                            <% } %>

                            <div style="padding-top:20px;">
                                <!-- New product notification ------->
                                <% if(HelperClass.IsNewProduct(Convert.ToDateTime(Model.Item[i].RegisterDate))){ %>
                                    <div class="newproduct">                        
                                        <a href="<%: _linke %>">
                                            <img src = "<%: HelperClass.ICEContact.PathProductImages+"newproduct.png"%>" alt="New Item" width="35px" height="35px" />
                                        </a>
                                    </div>
                                <% } %> 

                                <!-- detecting the existing of image -->
                                <a href="<%: _linke %>" style="text-decoration:none">
                                    <% 
                                        //Model.Item[i].Brand.IsAuthorized
                                        if (!string.IsNullOrEmpty(Model.Item[i].PictureName)) { %>          
                                            <img width="135px" src="<%:HelperClass.CheckImageUrlExist(HelperClass.ICEContact.PathProductImages+Model.Item[i].PictureName)%>" alt="<%: Model.Item[i].Name %>"/>
                                        <% }
                                        else { %>
                                            <img width="135px" height="100px" src="<%:HelperClass.NoImagePath %>" alt="No Image"/>            
                                        <% } 
                                    %>
                                </a>
                            </div>
                            <br style="clear: both;" />
                            <!-- start new -->

                            <% list.Add(Model.Item[i]);%>
                            <!-- end new -->
                        </div>                                
                    </td>
                <% }

                iStartIndex = iNumCollum;           
                iNumCollum += iIntialColum;

                if (iNumCollum > Model.Item.Count())//make sure that Index is not out of range {                   
                    iNumCollum = Model.Item.Count() ;                   
                } %>           
            </tr>

            <% 
                int k = 0;
                foreach(var bb in list) {
                    if (k % 3 == 0) { %>
                        <tr style="margin-left:20px;">
                            <td align="left" valign="top" style="padding-left:0px; padding-top:0px; border:1px dotted #CCCCCC;">
                                <% Response.Write(bb.Name); %>
                            </td>
                    <% }
                    else { %>
                        <td align="left" valign="top" style="padding-left:0px; padding-top:0px; border:1px dotted #CCCCCC;">
                            <%Response.Write(bb.Name);%>
                        </td>
                    <% }
                    k++; 
                }
            %>
            </tr>
            <% 
                iStartIndex = iNumCollum;           
                iNumCollum += iIntialColum;

                if (iNumCollum > Model.Item.Count()) { //make sure that Index is not out of range                    
                    iNumCollum = Model.Item.Count() ;                   
                }   
            %>   
            </tr>

            <% if (j < iNumRow - 1) { }

        }
    </table><br />                    
</div>

Answer 1

如果您打算这样做，可以使用asp：repeater控件简化您的方法：http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater.aspx

看一下这个例子：

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater(v=vs.71).aspx

然后，您可以避免在ASPX中循环和构建表格，这将使维护变得更加容易。

例如：

   <asp:Repeater id=Repeater1 runat="server">
      <HeaderTemplate>
         <table border=1>
            <tr>
               <td><b>Company</b></td>
               <td><b>Symbol</b></td>
            </tr>
      </HeaderTemplate>

      <ItemTemplate>
         <tr>
            <td> <asp:Image runat="server" id="MyImage" /></td>
            <td> <asp:Literal runat="server" id="SomeTextLiteral" /></td>
         </tr>
      </ItemTemplate>

      <FooterTemplate>
         </table>
      </FooterTemplate>

   </asp:Repeater>

在后面的代码中，处理Repeater1_ItemDataBoundEvent，你可以做一些事情，比如查看你是否有你期望的对象，并在ItemTemplate中查找控件，

请参阅http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.repeater.itemdatabound.aspx

您可以通过执行以下操作找到图像控件：

var image = e.Item.FindControl("MyImage")

并适当设置src。

许多选项，您可以更清晰地分离演示文稿和代码。

将列表中的数据显示到表中

1 个答案: