0

Im not quite sure how to explain my issue so let me know if Im unclear about anything.

I have on my front-end post form a multiple file upload input that uploads files to my specified folder and creates attachment id's etc.

if (!empty($_FILES['vidPix']['tmp_name'][0])) {
    $i = 1;
    $files = $_FILES['vidPix'];
    foreach ($files['name'] as $key => $value) {
        if ($files['name'][$key]) {
            $file = array(
                'name' => $files['name'][$key],
                'type' => $files['type'][$key],
                'tmp_name' => $files['tmp_name'][$key],
                'error' => $files['error'][$key],
                'size' => $files['size'][$key]
            );
            $_FILES = array("sight" . $i => $file);
            add_filter( 'upload_dir', 'wpse_141088_upload_dir' );
            add_filter('intermediate_image_sizes_advanced', 'no_image_resizing');

            $mfile =  wp_handle_upload($files, $upload_overrides );

            $newvidPix = sight("sight" . $i, $v_Id);
            remove_filter( 'upload_dir', 'wpse_141088_upload_dir' );
            remove_filter('intermediate_image_sizes_advanced', 'no_image_resizing');

            if ($i == 1) {
                update_post_meta($v_Id, '_thumbnail_id', $newvidPix);
            }
            add_post_meta($v_Id, 'vid_pix', $newvidPix, false);
        }
        $i++;
    }
}

when a file is uploaded, I display it on the front end -

<div id="pic-con">
<?php
    if (!empty($vid_pix)) {
        foreach ($vid_pix as $vP) {
            $filename = basename( get_attached_file( $vP ));
            echo '<div class="photo-upload-box">';
            echo '<img src="' . wp_get_attachment_thumb_url($vP) . '" alt=""/>';
            echo '<input type="hidden" class="pic_value" value="' . $filename . '" />';
            echo '<input type="hidden" name="'.$vP.'" class="orders" />';
            echo '</div>';   
        }
    }
?>
</div>

and using jquery I make each div sortable, so that I can change the displayed order of the images - example of how the sorting works

function updateIndexes() {
    $('#pic-con .orders').each(function(index) {
        $(this).val(index + 1);
    });
}

Which updates a hidden input with the order number -

Now I am trying to use the order number to save with the image so that it is always displayed in that order on page load or when echoing out the values to the $vid_pix meta key, etc.

For example - $vid_pix key contains 5 images: file1, file2, file3, file4, file5 and its corresponding order number - 1, 2, 3, 4, 5

But if I rearrange the order using divs on the front end -

1- file5, 2- file4, 3- file2, 4- file1, 5- file3

How can I save it in that order to my meta key? I came across the php function ksort but Im not quite sure how to apply to my situation.

EDIT

Ok so I seem to be getting closer to my end goal by adding a custom field to each attachment id. The custom field will be to store the number of the order ie 1.

The full code can be seen at my other question - here add_action( 'init', 'my_save_vid_pix_data' );

function my_save_vid_pix_data() {
    if ( ! isset( $_POST['attachments'], $_POST['v_Id'] ) ) {
        return;
    }

    $atts = (array) $_POST['attachments'];
    $post_id = absint( $_POST['v_Id'] );
    $vid_pix = get_post_meta($post_id, 'vid_pix', false);

    foreach ((array) $vid_pix as $vP) {
        if ( ! isset( $atts[ $vP ] ) || ! is_array( $atts[ $vP ] ) ) {
            continue;
        }

        update_post_meta($vP, 'photo_time', $atts[ $vP ]['photo_time']);
        update_post_meta($vP, 'photo_order', $atts[ $vP ]['photo_order']);
    }
}

So now I need to know how to sort the output (and if possible the db). Something like -

if (!empty($vid_pix)) {
foreach ($vid_pix as $vP) {
$filename = basename( get_attached_file( $vP ));
$Pt = get_post_meta($vP, 'photo_time', true);
$Por = get_post_meta($vP, 'photo_order', true);

// SOMETHING LIKE THIS
foreach ($vP SORT USING $Pt) {
echo 'IMAGES IN ORDER ACCORDINGLY'

EDIT 2

usort()

I tried using the usort function but right now its not showing anything -

if (!empty($vid_pix)) {
foreach ($vid_pix as $vP1) {
$filename = basename( get_attached_file( $vP1 ));
$Pt = get_post_meta($vP1, 'photo_time', true);
$Por = get_post_meta($vP1, 'photo_order', true);

function cmp($a, $b)
{
    if ($a['photo_order'] == $b['photo_order']) {
        return 0;
    }
    return ($a['photo_order'] < $b['photo_order']) ? -1 : 1;
}
usort($vP1, "cmp");
foreach ($vP1 as $vP) {
1

Answer Version 2

I apologize for the confusion.

Here's how you can use the usort() function to sort the images (in the div#pic-con on the front-end):

<div id="pic-con">
<?php
    if (!empty($vid_pix)) {
        usort( $vid_pix, function( $a, $b ){
            $aPor = (int) get_post_meta( $a, 'photo_order', true );
            $bPor = (int) get_post_meta( $b, 'photo_order', true );

            if ( $aPor === $bPor ) {
                return 0;
            }

            return ( $aPor < $bPor ) ? -1 : 1;
        } );

        foreach ($vid_pix as $vP) {
            // echo `div.photo-upload-box` here
        }
    }
?>
</div>
|improve this answer|||||
  • When i place the function code in my functions.php file it causes my site to crash – Rich Jun 30 '18 at 18:01
  • 1
    In that case, in the my_save_vid_pix_data() function code, try changing $vid_pix_sorted = []; to $vid_pix_sorted = array();. – Sally CJ Jul 1 '18 at 1:02
  • 1
    This is really the code you need to add to the existing code for the my_save_vid_pix_data() function. Did the error_log file show anything that might relate to the crash and that function? – Sally CJ Jul 1 '18 at 9:45
  • 1
    I think I may have misunderstood the relation between these two codes.. sorry about that and please check the updated answer. (You should restore the original my_save_vid_pix_data() function code, which didn't have the _vid_pix_sorted stuff.) – Sally CJ Jul 1 '18 at 19:32
  • 1
    thank you it worked. Is it possible for you to help me with one of my other questions – Rich Jul 5 '18 at 3:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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