Click here to Skip to main content
13,355,726 members (62,977 online)
Rate this:
 
Please Sign up or sign in to vote.
I am have a photo album(not gallery) which previews the photos withing it. The albums are dynamically generated depending on number of albums associated with the user. I want to add on click event to it so that when a person clicks an album it takes him to the photos within that album. I am beginner so I do not exactly know how it can be done. But I think adding command arguments should do the trick.

ASPX CODE:

<%
for (int i = 0; i < dt5.Rows.Count; i++)
{
    string q = "select  imageurl from photos where albumid='" 
                                        + dt5.Rows[i]["albumid"].ToString() + "'";
    dt6 = dbo.Getdt(q);
    a = dt6.Rows[0]["imageurl"].ToString();
    b = dt6.Rows[1]["imageurl"].ToString();
    c = dt6.Rows[2]["imageurl"].ToString();
    a= a.Substring(1, a.Length - 1);
    b = b.Substring(1, b.Length - 1);
    c = c.Substring(1, c.Length - 1);
  %> 
   <div   class="image_stack" style="margin-removed300px ; removed 418px;"   

         runat="server">
       <img   class="stackphotos photo1" src="<%: a %>"   />
       <img   class="stackphotos photo2" src="<%: b %>"  />
       <img "   class="stackphotos photo3" src="<%: c %>" />
   </div>
     <br /><br /><br /><br />
<% } %>
Posted 1-Apr-13 23:12pm

1 solution

Rate this: bad
 
good
Please Sign up or sign in to vote.

Solution 1

Hi,

try like below.

Add on click event for div tag.
<div class="image_stack" id="divAlbum" style="margin-removed300px ; removed 418px;">
onclick="return div_Click(this)" style="cursor:pointer;" runat="server">
    <img class="stackphotos photo1" src="<%: a %>" />
    <img class="stackphotos photo2" src="<%: b %>" />
    <img class="stackphotos photo3" src="<%: c %>" />
</img></div>


Add attributes from code behind. i.e add album ID as attribute from code as below.
divAlbum.Attributes.Add("ID", 10); // here 10 is just as example, you specify your ID

The above line of code, must be written where your binding the images to the div tag.

write javascript function like below.
function div_Click(sender)
{
    __doPostBack(sender.attributes["ID"].value, "div"); // target = album ID, argument = "div" - you can give any value to identify the event
    return true;
}


capture the argument in page load event as below.

protected void Page_Load(object sender, EventArgs e)
{
    if (Request.Params.Get("__EVENTARGUMENT").ToString() == "div")
    {
        // user clicked on div. 
        if (Request.Params.Get("__EVENTTARGET").ToString() != "")
        {
            // user clicked on div. do your coding here
            int AlbumID = Convert.ToInt32(Request.Params.Get("__EVENTTARGET").ToString());  //album ID
        }
    }
}


this will capture the event when user clicks anywhere within the div area

hope it helps
  Permalink  
v3
Comments
arbaaz jalil 2-Apr-13 4:48am
   
Your code seems helpful, but can you explain how can i pass the albumid of the div which has been clicked? I am a beginner(just so that you know).
Karthik Harve 2-Apr-13 4:52am
   
So, every div will be filled with photos of individual albums right ? i mean, every div will have unique album ID right ?
arbaaz jalil 2-Apr-13 5:05am
   
Each div displays the first 3 photos of one album, so yes one div=one album. Each iteration creates one album.
Karthik Harve 2-Apr-13 5:18am
   
try with my updated solution.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month


Advertise | Privacy |
Web02 | 2.8.180111.1 | Last Updated 2 Apr 2013
Copyright © CodeProject, 1999-2018
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100