Thiết kế website giá rẻ

Question

I am successfully adding the images of rent property in the database and but when i try to update it’s order from the front end

currently this is what database field saved in the db

a:5:{i:0;s:80:"http://localhost/hamza-office/wp-content/uploads/2024/04/6631234824252_dh600.png";
i:1;s:86:"http://localhost/hamza-office/wp-content/uploads/2024/04/66312348243d5_DISPOSABLES.png";
i:2;s:81:"http://localhost/hamza-office/wp-content/uploads/2024/04/6631234824511_DN8000.png";
i:3;s:81:"http://localhost/hamza-office/wp-content/uploads/2024/04/663123482463d_DP6000.png";
i:4;s:77:"http://localhost/hamza-office/wp-content/uploads/2024/04/663123482475e_HA.jpg";}

but when i try to update from the front end basically changing the order so i want is to update the order in the db as well for example if i moved disposables.png to index 0 and dh600.png to index 1 then the db save should look like these

a:5:{i:0;s:80:"http://localhost/hamza-office/wp-content/uploads/2024/04/66312348243d5_DISPOSABLES.png";
i:1;s:86:"http://localhost/hamza-office/wp-content/uploads/2024/04/6631234824252_dh600.png";
i:2;s:81:"http://localhost/hamza-office/wp-content/uploads/2024/04/6631234824511_DN8000.png";
i:3;s:81:"http://localhost/hamza-office/wp-content/uploads/2024/04/663123482463d_DP6000.png";
i:4;s:77:"http://localhost/hamza-office/wp-content/uploads/2024/04/663123482475e_HA.jpg";}

so i will se proper sorted gallery images

this is what i am trying i have shared my code of what i was trying

 <?php
/*
Template Name: Frontend Property Edit
*/

get_header();

// Check if the user is logged in
if (is_user_logged_in()) {
    // Check if post ID is provided
    if (isset($_GET['property_id']) && $_GET['property_id']) {
        $property_id = intval($_GET['property_id']);

        // Retrieve post content by ID
        $property = get_post($property_id);

        if ($property) {
            // Display form for editing post content
            ?>
                
            <section class='formsec'>
                <h2 class='Add-new-Head'>Edit Rental Property ✎</h2>
                <form method="post" class='split-form' enctype="multipart/form-data">
                    <div class="left-column">
                        <label for="title">Title:</label><br>
                        <input type="text" id="title" name="title" value="<?php echo esc_attr($property->post_title); ?>"><br>
                        
                        <!-- Gallery Images -->
                        <label for="gallery">Gallery Images:</label><br>
                        <div id="gallery_preview" class="sortable-gallery">
                            <?php
                            $gallery_images = get_post_meta($property_id, 'gallery_images', true);
                            if (!empty($gallery_images)) {
                                foreach ($gallery_images as $index => $image_url) {
                                    echo '<div class="sortable-item" data-index="' . $index . '">';
                                    echo '<img src="' . esc_url($image_url) . '" alt="Gallery Image" style="max-width: 200px;">';
                                    echo '</div>';
                                }
                            }
                            ?>
                        </div>
                        <input type="hidden" name="gallery_order" id="gallery_order" value="<?php echo esc_attr(json_encode(array_keys($gallery_images))); ?>">
                        <input type="submit" name="submit" value="Update">
                    </div>
                    <input type="hidden" name="property_id" value="<?php echo $property_id; ?>">
                </form>
            </section>

            <?php

            // Handle form submission for updating rental property
            // Handle form submission for updating rental property
        if (isset($_POST['submit'])) {
    // Retrieve property ID from the form
    $property_id = intval($_POST['property_id']);
    
    // Retrieve and sanitize other form inputs
    $title = sanitize_text_field($_POST['title']);
    // $content = wp_kses_post($_POST['content']); // Commented out as it's not being used in the form
    
    // Update post content
    $updated_post = array(
        'ID' => $property_id,
        'post_title' => $title,
        // 'post_content' => $content // Commented out as it's not being used in the form
        // Add more fields for updating post meta data if needed
    );

    $result = wp_update_post($updated_post);

    // Check if the post content is updated successfully
    if ($result !== 0) {
        // Retrieve the sorted order of gallery images
        $gallery_order = isset($_POST['gallery_order']) ? json_decode($_POST['gallery_order']) : array();
        
        // Update post meta data for gallery images
        update_post_meta($property_id, 'gallery_images', $gallery_order);
        
        echo 'Rental property updated successfully.';
    } else {
        echo 'Failed to update rental property.';
    }
    } else {
    echo 'No form submission detected.';
    }

        } else {
            echo 'Rental property not found.';
        }
    } else {
        echo 'No property ID provided.';
    }
    } else {
    echo 'You must be logged in to edit rental properties.';
    }
    get_footer();
    ?>
    <script>
    document.addEventListener('DOMContentLoaded', function () {
    var sortable = new Sortable(document.getElementById('gallery_preview'), {
        animation: 150,
        onEnd: function (evt) {
            var galleryItems = document.querySelectorAll('.sortable-item');
            var galleryOrder = [];

            // Iterate over the sorted gallery items to get their indexes
            galleryItems.forEach(function (item, index) {
                galleryOrder.push(item.getAttribute('data-index'));
            });

            // Send AJAX request to update the order in the database
            var formData = new FormData();
            formData.append('action', 'update_gallery_order');
            formData.append('property_id', <?php echo $property_id; ?>);
            formData.append('gallery_order', JSON.stringify(galleryOrder));

            fetch('<?php echo admin_url('admin-ajax.php'); ?>', {
                method: 'POST',
                body: formData
            })
            .then(response => response.json())
            .then(data => console.log(data))
            .catch(error => console.error('Error:', error));
        }
    });
    });

     </script>

Thiết kế website giá rẻ

Danh mục

sorting the image array would not update the order in the database wordpress