Grow your CSS skills. Land your dream job.

ajax load php into page div

  • # November 16, 2012 at 2:02 pm

    I’ve got a small php site where my index.php loads content based on the nav links — so a link “http://mysite.com/?page=contact” will load the contact.php file after the header.php, nav.php, and before the footer.php. Works great.
    Now I want to use jQuery ajax to load the various ‘content’ php files based on the URL as in the sample above. How do I do that? I’ve tried using the tutorial here (http://css-tricks.com/examples/AJAXReplaceSamePart/) but it depends on using nice neat .html extensions for the links.

    # November 16, 2012 at 6:03 pm

    @fiefscent,

    Have you tried this?

    jQuery’s .get( ) method

    # November 21, 2012 at 11:15 am

    got it. here’s what i did:

    var toLoad = $(this).attr(‘href’).match(/page=(.*)/)[1]+’.php';
    function loadContent() {
    $(‘#content’).load(toLoad,”,showNewContent())
    }

    # November 21, 2012 at 11:19 am

    Is this solved?

    # January 30, 2013 at 12:02 am

    I apologize in advance if this is too much to ask. My situation sounds much like the original question. I’ve got a php site with divisions, “header”, “navigation”, “content”, and “footer” in the css and includes in the index.php file for them. My goal is to have a folder with all the content pages which will load into the content division of the index file by clicking on a link in the navigation.php file. This way all I have to do is add a link for a new content page. I’ve read many online articles relating to this but I’m not a coder and they always leave out where the code goes and which variables to change. If I could get some specific example of how to do this, I’d be most appreciative. Here’s a couple of sites I’ve made that I want to change and eliminate the side menu if it’s possible to have enough submenus in the navigation bar to give the content.php more width.
    http://patrioticrevelations.com/

    http://patrioticrevelations.com/gec/

    # January 30, 2013 at 11:50 am

    I think I found a solution and I think I probably should’ve started a new thread with my question. Please just delete my two posts. FWIW, here’s what I did.

    put the following in the content.php file

    < ?php
    $default = “info/pageone.php”;
    $allowed = array (
    ‘info/pagetwo’,
    ‘info/pagethree’,
    );
    if( isset( $_POST[“P”] ) || isset( $_GET[“P”] ))
    {
    $page = isset($_GET[“P”]) ? $_GET[“P”] : $_POST[“P”];

    if( in_array( trim ( $page ), $allowed ))
    {
    $file = $page . “.php”;
    if( (file_exists( $file )))
    {
    include( $file );
    }
    else
    {
    include( $default );
    }
    }
    else
    {
    include( $default );
    }
    }
    else
    {
    include( $default );
    }
    ?>

    navigation.php has:

    Page One    
    Page Two     
    Page Three    

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".