load custom fields on click

1 Views

I have too much data stored in custom fields which I don’t want to fetch on page-load, instead I’d give the user the opportunity to load the custom field values on click, possibly with ajax.

Is there a working way to do this?

Read More

I don’t have any code yet just the wp loop. I’m thinking about putting the custom field queries in a separate php file, but I have no idea how to make connection between single.php and the separate file. (loading the file with ajax is no problem.)

UPDATE:
I don’t need ajax, it’s just confusing me so far. I just want to display the custom fields associated with the post on a different page template. I think of it as if the custom fields would be “children” of a given post and clicking a link would load a page with just the custom fields on it.

Thanks.

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. I don’t know if you’ve found an answer on this question yet since it’s from 2011 but I have an idea on how to retrieve the data.

    What if you created a VERY simple php file that took the post ID as a get variable and displayed the post’s custom fields?

    It would look something like this:

    <?php
    require_once($_SERVER['DOCUMENT_ROOT'] . '/wp-load.php');
    $post_ID = $_GET['id'];

    $custom = get_post_custom($post_ID);

    foreach ($custom as $key => $value) {
        if (($key != '_edit_lock' && $key != '_edit_last'))
            echo '<tr><td>' . $key . '</td><td>' . $value[0] . '</td></tr>';
    }
?>

    This will create a table of name (Custom Field Name) and value (Custom Field Value). If you don’t want to use a table, of course you can format the internal bits however you want. I’m just trying to set you on the right track. Also, notice that there’s an if statement in there. I’m sure you don’t want to output the edit lock value or the last edit value.

    Now, on to how to get this information from the page:

    First, you’ll need to create a button that will show the information.

    <a href="<?php echo bloginfo('template_directory'); ?>/custom-field-provider.php?id=<?php echo $post->ID; ?>" class="show-more">See More Information</a>

    And a box to show what you’re going to AJAX in:

    <div id="more-information-box" style="display: none;"></div>

    You’ll want to make up some cool little jQuery goodness here.

    $(document).ready(function () {
    $('.show-all').on('click', function (e) {
        // Since we're already passing the data through the link, we don't need to do anything else. Just pull the url from the link.
        var url = $(this).attr('href');

        // A simple jQuery.get function to get the data from the php script we wrote earlier
        $.get(url, function (data) {
            $('#more-information-box').hide().empty().append(data).fadeIn(500);
        });

        // And stop the link from actually going to the page.
        e.preventDefault();
        return false;  // Better safe than sorry, right?
    });
});

    And that should do it for you.

    I know it was a bit long-winded, but I really wanted to cover all the bases. I hope this helped you out.