Embedding other system and overriding it links

Question

Hello,

I have a question. Is there is a way to override hrefs, posts and etc? In example I embed 3rd part forum inside of my container and I click anything there page response will be loaded into the same container and not reloading everything in the window.

Answer 1

Yes, there are two ways you can do this:

1. Using an iframe. iframes are independent windows embedded within the window, and so navigation within the iframe stays within the iframe. So load the 3rd party forum there. This will be the easiest and most compatible way.

2. (This is rather more complicated.) After page load, you can hook the click event on links and the submit event on forms with client-side Javascript. When the user clicks a link, cancel the click event and use Ajax to load the HTML for the link and then insert it into your page at the appropriate location. Similarly, when the user clicks the submit button of a form, use the event to gather the form information and send the POST via Ajax instead (cancelling the submit event), then process the response. Note that in both cases (clicking links and posting forms), the browser navigation buttons will not do what the user expects unless you also integrate a history management library into your site, which further increases complexity.

Answer 2

with iQuery you can have something like this

$('a').click(function(e) 
{
    e.preventDefault();
    window.open(this.href);

}