Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Mar 2013
    Posts
    15
    Thanks
    4
    Thanked 0 Times in 0 Posts

    image lightbox not working anymore after javascript sort function

    Hi,

    This is my site.

    I linked names to jpgs and put the links in a column of a searchable and sortable data grid. Clicking on one of these image-links opens the corresponding image in the lightbox.

    But when I click on the column-header, which triggers a javascipt sort, the lightbox stops working for all following image-link-clicks untill i reload the page.

    Can you help me please to get the lightbox working properly?

    The grid-cell with the image link looks like this:

    Code:
    <td><a id="img1" href="http://www.image.jpg" rel="lightbox[1]">NAME</a></td>
    The grid-declaration-tag is:
    Code:
    <table class="tinytable" id="tsctablesort1">

    The grid settings are:
    Code:
    <script type="text/javascript">
        var sorter = new TINY.table.sorter('sorter','tsctablesort1',{
            headclass:'head',
            ascclass:'asc',
            descclass:'desc',
            evenclass:'tsort-evenrow',
            oddclass:'tsort-oddrow',
            evenselclass:'tsort-evenselected',
            oddselclass:'tsort-oddselected',
            paginate:true, // pagination (true,false)
            size:10, // show 10 results per page
            colddid:'tsort-columns',
            currentid:'tsort-currentpage',
            totalid:'tsort-totalpages',
            startingrecid:'tsort-startrecord',
            endingrecid:'tsort-endrecord',
            totalrecid:'tsort-totalrecords',
            hoverid:'tsort-selectedrow',
            pageddid:'tsort-pagedropdown',
            navid:'tsort-tablenav',
            sortcolumn:1, // sort column 1
            sortdir:1, // sort direction
            columns:[{index:6, format:'%', decimals:1},{index:7, format:'$', decimals:0}], // classify for proper sorting
            init:true // activate datagrid (true,false)
        });
      </script>

    And these two javascripts are includede in the head of the page:


    Code:
    <!-- jQuery Library 
    <script type="text/javascript" src="http://www.dreamtemplate.com/dreamcodes/jquery.min.js"></script> 
    <!-- DC DataGrid JS -->
    <script type="text/javascript" src="http://www.dreamtemplate.com/dreamcodes/datagrid/js/tsc_datagrid.js"></script>

    Not sure which all infomation is relevant here?!

  • #2
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    your page already has a copy of jQuery 1.5.1 linked in the head section, so you are loading jQuery twice on the same page, this wont work. you need to remove the reference to jquery you added with your datagrid script.

    If the datagrid script still works fine, you might be ok, if not you will need to remove that reference anyway and remove the otehr one in yoru head section as well, then in the head section you can paste your reference to jquery you used with your datagrid script.


    those options should get you going, if not, you may need to take a look at how the lightbox script is initializing and if its watching the dom or not

  • #3
    New Coder
    Join Date
    Mar 2013
    Posts
    15
    Thanks
    4
    Thanked 0 Times in 0 Posts
    ok thanks i switched to fancybox lightbox and it works


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •