jQuery Tutorials: AJAX Load Content No Page Refresh

20th of January 2014 25

jQuery Tutorials: AJAX Load Content No Page Refresh

Loading content via a menu, with no page refresh. With a little help from the jQuery JavaScript library. Official website http://phpacademy.org Support Forum…
Video Rating: 4 / 5

Filed under § jquery — Tagged with , , , , , ,

Share it!

Was it good for you to?


Support for the site!

No sponsors at the moment.

25 great comment(s) for this post

  1. Bang Girl 7:28 pm 20/01 of 2014

    thank you so much, i love you man!

  2. A Estrada 7:57 pm 20/01 of 2014

    Awesome, is jquery compatible with sql server? All tutorials are using php!

  3. PIXYBoy79 8:26 pm 20/01 of 2014

    Why are those files of type php ? can they not be saved just as html ?

  4. Stephen Calderon 9:19 pm 20/01 of 2014

    great tut mate!

  5. Jonathan Maingot 9:34 pm 20/01 of 2014

    Great video, much thanks!

  6. El Heren 10:29 pm 20/01 of 2014

    Lifesaver for noobs like me.

  7. Sakitsunebi 11:11 pm 20/01 of 2014

    that was a good tutorial. I never would have thought to load main pages
    using Ajax. two questions tho, how would you do this if your navbar was a
    PHP include from another file? also, I’m wondering how this would affect
    SEO because if your loading pages without a refresh, google might think
    your always on the same page.

  8. sammuelnevarez 12:01 am 21/01 of 2014

    Great tutorial. Will thumbs up and Subscribe.

  9. Jan Hruška 12:30 am 21/01 of 2014

    thank you very much! great tutorial!

  10. Narinder Sahani 1:06 am 21/01 of 2014

    Awesome tutorial. I am very very thankful to you

  11. Aditya Batra 1:48 am 21/01 of 2014

    it is very useful for me. Thanks

  12. Vast olic 2:35 am 21/01 of 2014

    Great tutorial! I m just wondering how can I repeat the process if I want
    to nest a third page inside the previous one? say in order to add a
    sub-page to the about us one so it goes Index/About/New Page

  13. Diben Broll 3:14 am 21/01 of 2014

    ctrl+d to duplicate row in n++

  14. Maja Maras 3:36 am 21/01 of 2014

    great tutorial but one question … how do i make the other links that are
    in my content area to work…?

  15. ev3rlost 3:59 am 21/01 of 2014

    Thanks for the tutorial … in fact, thanks for learning me to code PHP and
    jQuery!!! :D One question though ~ got any ideas how to avoid the instant
    load of content? I’ve added some animation to the content div and I used
    the .delay() function, which aparenty does not have an effect on the
    .load() function. Example: $(‘#content’).fadeOut(200);
    $(‘#content’).delay(200).load(‘pages/’ + page + ‘.php’);

  16. gilramirez12 4:27 am 21/01 of 2014

    I like the sound of your keyboard.

  17. Mourad RASSA 5:13 am 21/01 of 2014

    thank you brother for all what you do for the peoples here i’m from morocco
    i need some tuto about flash cs5 anyone here know ahannel where i can see

  18. ev3rlost 5:21 am 21/01 of 2014

    @123wendywhite Thanks for your suggestion, but it had no effect on the
    delay of the .load() function. Instead, I used the setTimeOut function,
    which apparently works! setTimeout(function(){ $(‘#content’).load(‘pages/’
    + page + ‘.php’); },300);

  19. KatiushaVN4 6:08 am 21/01 of 2014

    I was successfully following you step by step until I typed “return false;”
    in the general (dot) js file and it doesn’t respond showing content when I
    click on each link. Strange!!

  20. Martijn Schoenmaker 6:43 am 21/01 of 2014

    .load doesn’t work with me… it wil only load index.php itself, so then i
    get two menu’s underneath each other. I did everything exactly the same as

  21. David 7:12 am 21/01 of 2014

    nice tutorial and cool accent!

  22. Pharmokan z 7:22 am 21/01 of 2014

    thanks for explaining very clearly and at a fast pace everything was
    informative nothing was filler.

  23. chad362wiley 7:29 am 21/01 of 2014

    I love alex

  24. Cataclismo 8:25 am 21/01 of 2014

    Very nice. I search for this more time,but is here! Thanks!

  25. PearSquirrel 9:10 am 21/01 of 2014

    I see, that’s really good to know! Thanks.


Your opinion matters. Add it below.

Tip: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Recent comments


Copyright jqueryui.info since 2010. All rights reserved. Design and the Absolute Theme by Tommie Hansen.