Hi! I have created a listview in which data is binded from a sharepoint list. There is an asp image button inside the listview on clicking which a an image should be displayed.
The code is as follows:

ASPX file:

<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register Tagprefix="asp" Namespace="System.Web.UI" Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>
<%@ Import Namespace="Microsoft.SharePoint" %>
<%@ Assembly Name="Microsoft.Web.CommandUI, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ListViewDemo.aspx.cs" Inherits="TestAppPage.Layouts.TestAppPage.ListViewDemo,TestAppPage,Version=1.0.0.0, Culture=neutral, PublicKeyToken=ef990c799011c0a9" EnableEventValidation="false"%>
<%@ Register Assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" Namespace="System.Web.UI.WebControls" TagPrefix="asp" %>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<table><%--<tr><td>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="true">
    </asp:GridView>

</td></tr>--%>
<tr>
<td>
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="Label4" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="Label5" runat="server" Text="Label"></asp:Label>
    <asp:Label ID="lblDetect" runat="server" Text="Label"></asp:Label>
</td>
</tr>
</table>
<table id="table1" cellspacing="2" cellpadding="2" width="100%">
<tr><td colspan="2"><asp:Label ID="Label6" runat="server" Text="Select from a list of Widgets to add to your Info Zone" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label></td></tr>
<tr>
<td valign="top" width="15%">
<asp:Label ID="Category1" runat="server" Text="Popular" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
<asp:Label ID="Category2" runat="server" Text="Editors Picks" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
<asp:Label ID="Category3" runat="server" Text="News" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
<asp:Label ID="Category4" runat="server" Text="Calculators" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
<asp:Label ID="Category5" runat="server" Text="Community" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
<asp:Label ID="Category6" runat="server" Text="Learning" Font-Names="Arial" Font-Bold="true" Font-Size="12px"></asp:Label>
<br />
</td>
<td valign="top" width="85%">
<table>
<tr>
<td valign="top" width="40%">
<asp:listview ID="lstViewImageList" runat="server" GroupItemCount="2" OnItemCommand="lstViewImageList_ItemCommand">
<LayoutTemplate>
<table cellpadding="2" width="100px" runat="server" id="tblProducts">
            <tr runat="server">
              <th runat="server" align="left"></th>
            </tr>
            <tr runat="server" id="groupPlaceholder" />
          </table>
</LayoutTemplate>
<GroupTemplate>
<tr runat="server" id="ImagesRow">
            <td runat="server" id="itemPlaceholder" />
          </tr>
</GroupTemplate>
<GroupSeparatorTemplate>
<tr runat="server">
            <td colspan="3"><br /></td>
          </tr>
</GroupSeparatorTemplate>
<ItemTemplate>
<td align="center" style="width:50px" runat="server">
<asp:ImageButton ID="Image" runat="server" ImageUrl='<%# Eval("ImageURL") %>' Width="100px" Height="100px" CommandName='<%# Eval("ImageDesc") %>' CommandArgument='<%# Eval("ImageURL") %>'/>
               <br />
<asp:HyperLink ID="ImageLink" runat="server" Text='<%# Eval("ImageDesc") %>'></asp:HyperLink>
</td>
</ItemTemplate>
<ItemSeparatorTemplate>
<td runat="server"></td>
</ItemSeparatorTemplate>
</asp:listview>
</td>
<td valign="top" width="60%"><div id="showimage" style="width: 500px; height: 500px"><asp:Image ID="imgView" runat="server" Width="300px" Height="300px"/></div></td>
</tr>
<tr>
<td colspan="2">
    <asp:Label ID="lblCount" runat="server"></asp:Label>&nbsp;&nbsp;
<asp:DataPager runat="server" ID="ImageDataPager" PagedControlID="lstViewImageList" OnPreRender="lstViewImageList_PreRender" PageSize="6">
 <Fields>
          <asp:NextPreviousPagerField ButtonType="Link"
            ShowFirstPageButton="false" 
            ShowPreviousPageButton="true"
            ShowNextPageButton="true"
            RenderDisabledButtonsAsLabels="false"/>
          <%--<asp:NumericPagerField ButtonCount="2" />--%>
          <asp:NextPreviousPagerField ButtonType="Link"
            ShowLastPageButton="false"
            ShowNextPageButton="false"
            ShowPreviousPageButton="false" />
        </Fields>
</asp:DataPager>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>

C# codebehind file:

using System;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using System.Data;
using System.Web.UI.WebControls;

namespace TestAppPage.Layouts.TestAppPage
{
    public partial class ListViewDemo : LayoutsPageBase
    {
        DataTable dt;
        int itemCount = 0;
       //protected void Page_Init(object sender, EventArgs e)
       //{
       //    try
       //    {
       //        lstViewImageList.Init +=new EventHandler(lstViewImageList_Init);
       //    }
       //    catch (Exception ex)
       //    {
       //        Label3.Text = ex.Message;
       //    }
       //}

       //protected void lstViewImageList_Init(object sender, EventArgs e)
       //{
       //    try
       //    {
       //        lstViewImageList.ItemCommand+=new EventHandler<System.Web.UI.WebControls.ListViewCommandEventArgs>(lstViewImageList_ItemCommand);
       //    }
       //    catch (Exception ex)
       //    {
       //        Label5.Text = ex.Message;
       //    }
       //}

       protected void Page_Load(object sender, EventArgs e)
        {
            try
            {
                SPWeb web = SPContext.Current.Web;
                SPList list = web.Lists["ImageList"];
                SPListItemCollection lstItemColl = list.GetItems();
                itemCount = lstItemColl.Count;
                dt = lstItemColl.GetDataTable();
                dt.Columns.Remove("Title");
                dt.Columns.Remove("ID");
                dt.Columns.Remove("ContentType");
                dt.Columns.Remove("Modified");
                dt.Columns.Remove("Created");
                dt.Columns.Remove("Author");
                dt.Columns.Remove("Editor");
                dt.Columns.Remove("_UIVersionString");
                dt.Columns.Remove("Attachments");
                dt.Columns.Remove("LinkTitleNoMenu");
                dt.Columns.Remove("LinkTitle");
                dt.Columns.Remove("DocIcon");
                dt.Columns.Remove("ItemChildCount");
                dt.Columns.Remove("FolderChildCount");
                lstViewImageList.DataSource = dt;
                lstViewImageList.DataBind();
                //GridView1.DataSource = dt;
                //GridView1.DataBind();
                lstViewImageList.ItemCommand += new EventHandler<ListViewCommandEventArgs>(lstViewImageList_ItemCommand);
                lstViewImageList.PagePropertiesChanging+=new EventHandler<PagePropertiesChangingEventArgs>(lstViewImageList_PagePropertiesChanging);
            }
            catch (Exception ex)
            {
                Label1.Text = ex.Message;
            }
        }

       public void Page_Error(object sender, EventArgs e)
       {
           Exception objErr = Server.GetLastError().GetBaseException();
           string err = "<b>Error Caught in Page_Error event</b><hr><br>" +
                           "<br><b>Error in: </b>" + Request.Url.ToString() +
                           "<br><b>Error Message: </b>" + objErr.Message.ToString() +
                           "<br><b>Stack Trace:</b><br>" +
                             objErr.StackTrace.ToString();
           Response.Write(err.ToString());
           Server.ClearError();
       } 


        protected void lstViewImageList_PreRender(object sender, EventArgs e)
        {
            try
            {
                lstViewImageList.DataSource = dt;
                lstViewImageList.DataBind();
            }
            catch (Exception ex)
            {
                Label2.Text = ex.Message;
            }
        }

        protected void lstViewImageList_ItemCommand(object sender, ListViewCommandEventArgs e)
        {
            try
            {
                lblDetect.Text = "You clicked on" + (String)e.CommandArgument + "image";
                imgView.ImageUrl = (String)e.CommandArgument;
                
            }
            catch(Exception ex)
            {
                Label4.Text = ex.Message;
            }
        }

        protected void lstViewImageList_PagePropertiesChanging(object sender, PagePropertiesChangingEventArgs e)
        {
            try
            {
                int lastImage = 0;
                int currentPage = (e.StartRowIndex / e.MaximumRows);
                int pageSize = ImageDataPager.PageSize;
                int divResult = itemCount / (currentPage+1);
                int firstImage = 1 + (currentPage*pageSize);
                if (divResult <= pageSize)
                {
                    lastImage = itemCount;
                }
                else
                {
                    lastImage = firstImage + pageSize - 1;
                }
                lblCount.Text = "Showing: " + firstImage + " to " + lastImage + " of " + itemCount;
            }
            catch (Exception ex)
            {
                Label3.Text = ex.Message;
            }
        }
    }
}

The problem is the picture is not being displayed because the itemcommand event is not firing.
Please help.

Recommended Answers

All 2 Replies

Put some debug statements/break points and see what happen while debugging app.

Sorry! It was my mistake. I did the binding process twice
1. Page Load
2. Pre Render

I removed the page load binding and the issue is fixed.

Thank You.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.