Databases
StackOverflow2013
Postsdbo
POTriggering a click event based on browser # link
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POTriggering a click event based on browser # link
    primarykey
    data
    text
    <p>I currently have a gallery of thumbnails which when clicked animates a modal window and loads in content via ajax. I have used 'window.location.hash' to create a unique url for the content that is loaded into my modal.</p> <pre><code>var base_url = "http://www.ddbremedy.co.uk/siteupdate/"; $('#work_gallery li a').on('click', function(event) { event.preventDefault(); postLink = $(this).attr('href'); window.location.hash = postLink.replace(base_url, ""); }); </code></pre> <p>The modal then animates in and the content loads via ajax. Then when I close the modal I add this code to remove the hash and url suffix that was added when the ajax page was loaded.</p> <pre><code>if ("pushState" in history) { history.pushState("", document.title, window.location.pathname); } else { window.location.hash = ""; } </code></pre> <p>This all works fine, but what I need is to be able to take the ajax link that was generated and when pasted into a new window, automatically trigger a click event on the correct thumbnail to load the correct content. I know can basically detect if there is a hash and particular word in the url like this:</p> <pre><code>var pathname = window.location.hash; if (pathname.indexOf("work") &gt;= 0) { // trigger click event on correct thumbnail to launch modal } </code></pre> <p>I know i need to probably trigger a click event like this:</p> <pre><code>$('#work_gallery li a').trigger('click'); </code></pre> <p>but I can't figure out how to apply it to the correct thumbnail based on the url of the ajax content. The modal itself is done using jquery, without any plug-ins and I also need to keep it that way. Any help would be greatly appreciated.</p> <p>Many thanks in advance.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USuser1391152
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COCould you not use: `$('#work_gallery li a[href="'+pathname+'"').trigger('click')`?
      singulars
      1. POTriggering a click event based on browser # link
      1. USBenM
    2. COI am confused a little. Is there only one gallery thumbnail? If not, I think you better use IDs of that thumbnails. on click change domain to my.domain.com/gallery/'galleryIDnumber' and on every gallery/somenumber page get the number part of that url and trigger a click event to that element whose ID is in the url.
      singulars
      1. POTriggering a click event based on browser # link
      1. USHasan
    3. COHi Hasan, no there are about 20 links within the container
      singulars
      1. POTriggering a click event based on browser # link
      1. USuser1391152
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload