1

I am developing a plugin that adds a Custom Post Type to my theme. It's a retail directory and the post type is a retail listing.

Everything is working fine. I can upload content to the DB and then print in a customized CSS framework I have developed. However, when i want to upload and display an image, that's when I have problems.

The problem occurs when the image is uploaded. I use the update_post_meta() to update the meta information of the image which is related it to the post ID and post it to the database table "wp_postmeta" under column "meta_value". I also use the WP media upload JQuery Code to select the image. I'm not sure where the problem is exactly, but I know it's with the upload because when the image goes into the "meta_value" column has value NaN and not the ID value that it should be.

Here's the upload code:

add_action( 'save_post', 'process_image_meta', 10, 2 );

function process_image_meta( $post_id, $post ) {
        update_post_meta( $post_id, '_image_id', $_POST['upload_image_id'] );
    }

And the wp media uploader code:

And finally, the display code:

function display_retail_listing_meta_box($retail_listing) {
    // Retrieve current shop details based on retail lisitng ID

    global $post;

        $image_src = '';
    $image_id = get_post_meta( $post->ID, '_image_id', true);
    $image_src = wp_get_attachment_url( $image_id );
?>

<table>
<tr>
<td style="width: 100%">Image Upload</td>
<td><img id="shop_image" src="<?php echo $image_src; ?>" style="max-width:100%;" />
<input type="text" name="upload_image_id" id="upload_image_id" value="<?php echo $image_id; ?>" />
<a title="<?php esc_attr_e( 'Upload Image' ) ?>" href="#" id="upload-image"><?php _e( 'Upload Image' ) ?></a>
<a title="<?php esc_attr_e( 'Remove Image' ) ?>" href="#" id="remove-image" style="<?php echo ( ! $image_id ? 'display:none;' : '' ); ?>"><?php _e( 'Remove Image' ) ?></a>
</tr>
</table>

Followed by the WP Media Upload Code:

jQuery(document).ready(function($) {

        // save the send_to_editor handler function
        window.send_to_editor_default = window.send_to_editor;

        $('#upload-image').click(function(){

            // replace the default send_to_editor handler function with our own
            window.send_to_editor = window.attach_image;
            tb_show('', 'media-upload.php?$post_id=<?php echo $post->ID ?>&amp;type=image&amp;TB_iframe=true');

            return false;
        });

        $('#remove-image').click(function() {

            $('#upload_image_id').val('');
            $('img').attr('src', '');
            $(this).hide();

            return false;
        });

        // handler function which is invoked after the user selects an image from the gallery popup.
        // this function displays the image and sets the id so it can be persisted to the post meta
        window.attach_image = function(html) {

            // turn the returned image html into a hidden image element so we can easily pull the relevant attributes we need
            $('body').append('<div id="temp_image">' + html + '</div>');

            var img = $('#temp_image').find('img');

            imgurl   = img.attr('src');
            imgclass = img.attr('class');
            imgid    = parseInt(imgclass.replace(/\D/g, ''), 10);

            $('#upload_image_id').val(imgid);
            $('#remove-image').show();

            $('img#shop_image').attr('src', imgurl);
            try{tb_remove();}catch(e){};
            $('#temp_image').remove();

            // restore the send_to_editor handler function
            window.send_to_editor = window.send_to_editor_default;

        }

    });
    </script>

2 Answers 2

1

The action sends the $post_id just like you have so that's not the problem.

Have you tried a var_dump of $_POST to make sure it's actually posting something other than null?

Also, using the save_post action is going to be called every time a post is saved, so you probably need to use the save_post_{custom_post_type} action, replacing {custom_post_type} with your actual custom post type (if it is one).

You could try this:

function process_image_meta( $post_id, $post ) {
        error_log('POSTED: ' . $_POST['upload_image_id']);
        $result = update_post_meta( $post_id, '_image_id', $_POST['upload_image_id'] );
        error_log('Image Meta Added: ' . $result);
    }

Make sure you have this in your wp-config.php:

define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);

Then check the /wp-content/debug.log file for the output

0

i think the problem is in your save meta values function, try with global $post;

function process_image_meta() {
    global $post, $post_id;
    update_post_meta( $post_id, '_image_id', $_POST['upload_image_id'] );
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.