?
Solved

Lightbox photos in ASP.net

Posted on 2010-04-07
1
Medium Priority
?
880 Views
Last Modified: 2012-06-21
First of all I am a novice on ASP.net

I have an aspx page with connection to a sql2005 server. I have tried to add a lightbox photo gallery object to the Gridview. I had help on getting it started however I seem to have lost my source on help for the moment. The page works when pulling data from the SQl dbase until I add in the lightbox feature. Here is the code in the page. I get the error on the IIS server when I try to run the page.
error CS0103: The name 'Image1' does not exist in the current context
I can't find a reference of Image1 anywhere
<asp:GridView ID="grdProjects" runat="server">
        </asp:GridView>--%>
        
        <asp:DataList ID="grdProjects" runat="server">
        <ItemTemplate>
          <table width="527" border="0" align="center" cellpadding="0" cellspacing="0">
		    <tr>
		      <td width="87" valign="bottom">&nbsp;</td><td width="262"></a>
		      <td width="168">&nbsp;</td>
		      <td width="10">&nbsp;</td>
	        </tr>
		    <tr>
		      <td height="28" colspan="3" align="left" valign="top"><strong class="AFSCSS"><asp:Label ID="lblProjectName" runat="server"
            text= '<%# Eval("ProjectName") %>' />&nbsp;&bull;&nbsp;
            <asp:Label ID="lblCity2" runat="server"
                    Text='<%# Eval("City") %>' />
            ,&nbsp;
            <asp:Label ID="lblState2" runat="server"
                    Text= '<%# Eval("ProjectState") %>' /></strong></td>
	        </tr>
		    <tr>
<!-- ----LightBox --->
		      <asp:Repeater ID="RepeaterLightBox" runat="server">
                  <HeaderTemplate>
              <td width="87" valign="bottom">
              </HeaderTemplate>
                <ItemTemplate>
              <a id="LightBoxImage" href="images/projects/ina.jpg" width="62" height="58"  
			rel="lightbox[Photo]" title="my caption">
                        <img id="pic" src="images/projects/ina.jpg" alt="No Image Available!" />
                    </a>
               
                <asp:Repeater ID="RepeaterLightBox" runat="server">
                  <HeaderTemplate>
                    
                </HeaderTemplate>
                <ItemTemplate>
                                    
                        <a id="LightBox_Content" href="<%#DataBinder.Eval(Container.DataItem,
			 "PhotoPath")%><%#DataBinder.Eval(Container.DataItem,
			 "PhotoName")%>" rel="<%#DataBinder.Eval
					(Container.DataItem, "rel")%>"
			 title="<%#DataBinder.Eval(Container.DataItem, "GroupName")%>"> </a>
             </ItemTemplate>
                <FooterTemplate>
                </FooterTemplate>
                </asp:Repeater>
                </td>
             
                
             
		      <td colspan="2" align="left" valign="top" class="textsmall">Client: <span style="color: #03F"><asp:Label ID="lblClient" runat="server"
                    text='<%# Eval("Client") %>' />&nbsp;&ndash;&nbsp;</span><span style="color: #03F"><asp:Label ID="lblClientType" runat="server"
                    text='<%# Eval("ClientType") %>' /></span><br>
		        Number of Buildings:<span style="color: #03F"><asp:Label ID="lblNOB" runat="server"
                    text='<%# Eval("NumberOfBuildings") %>' /></span><br>
              Number of Units: <span style="color: #03F"><asp:Label ID="lblNOU" runat="server"
                    text='<%# Eval("NumberOfUnits") %>' /></span><br>
              Project Description: <span style="color: #03F"><asp:Label ID="lblDescription" runat="server"
                    text='<%# Eval("ProjectDescription") %>' /></span></td>
	      </table>
              </ItemTemplate>

        </asp:DataList>
          </form>

Open in new window

0
Comment
Question by:Bill Warren
1 Comment
 
LVL 3

Accepted Solution

by:
alexbumbacea earned 2000 total points
ID: 30051393
Make sure you insert Snippet 587816 this into your template.
After that add class lightbox to the link that you want to open into a lightbox window.
Also make sure to add bellow code to your page:

<script type="text/javascript">
$(function() {
      $('a.lightbox').lightBox(); // Select all links with lightbox class
});
</script>
This code will do all the trick -> it will add an onclick handler for the link that will open the href of the link into a lightbox window.
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox-0.4.js"></script>

Open in new window

0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
An ASP.NET Web Form User Control is not newly introduced in ASP.NET. In fact, it was an old technology yet still playing a role to generate web content, especially when we want to use it to have a better and easy way to control part of the web conte…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

599 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question