CODEWITHSUNDEEP
ajaxjquery
bb2
bb2

Reputation: 2982

Link to another page with ajax elements

I have a website and I want to link page1 to page2:

Page2 -has a submenu which displays information like this:

$("#element").click(function(){
        $("#another_element").load("page3.html");
    });

on Page1, I have links, and I want to know if it is possible to have a href="page2.html/call_ajax_function_from_page2" with the ajax call. How can i click on an element in page1 and go to page2 an call it's load() so that it displays the info as if an element from its submenu were clicked?

Thanks! Additional info By clicking an element in page1.html i want to redirect o page2.html with certain ajax content loaded to it. page2.html is the one with ajax

More info: I want to do this because on page1 I have a carousel, and each button I want it to link to a completely different page, page2 to display info relevant to that carousel. I have already built that page2 and it loads content based on .load when a link from its submenu was clicked.

Upvotes: 2

Views: 3609

Answers (1)

daryl
daryl

Reputation: 15197

I may be wrong as your question is hard to understand, but I think you're looking for something along the lines of this:

$('#foo li a').each(function() {
    $(this).click(function(e) {
        e.preventDefault();
        var href = $(this).attr('href');
        $('#bar').load(href + ' #someContainer'); // Load the href + an ID.
    });
});

So for example take this html:

<ul id="foo">
    <li><a href="http://google.com">Link 1</a></li>
    <li><a href="http://microsoft.com">Link 2</a></li>
    <li><a href="http://apple.com">Link 3</a></li>
</ul>

If you were to click link 2, the preventDefault() will 'prevent' your browser location from changing (changing page) then you will store the attribute of that anchor link in a variable called href. Then finally you will load the contents of that variable into your specified div, in this case 'bar'.

Upvotes: 2

Related Questions