How to jump to anchor in a modal?

Question

So I'm trying to do 2 anchor jumps in one go. One for the parent page (this is easy) and one for a triggered modal.

Here's where I'm at so far.

1. User clicks on link, eg. mydomain.com/page/#modal1-comment5

2. The page processes the fragment, jumps to <a name="modal1"></a> and triggers a modal to pop up (using jqModal) and sends "comment5" to the modal's PHP ajax file via $_GET .

3. Now <a name="comment5"></a> exists in the modal and potentially on the parent page as well. This is because the parent page and the modal share code to display user comments.

4. In the ajax file I've tried 'location.hash = "#comment5"' and it anchor jumps on the parent page.

5. comment5.scrollIntoView() sort of works and jumps both the modal and parent page.

My question is, is it possible to anchor jump purely in a modal's ajax file and not have it affect the parent page?

Answer 1

Try to do the trick. Append to a document hidden anchor linked to your target, click it programmatically and remove it. Like this:

var getComments = $.ajax({
  url: '/some/url',
  success: function( response ){
    // here somehow you handle response and put it into a modal
    // thus <a name="commment5"></a> appeared in DOM
    $( document.body ).append( '<a href="#link_to_comment5" style="display:none"></a>' );
    $( '#link_to_comment5' ).click().remove();
  }
});