0

I have added a organizer input filed using "select and option" tag, screenshot - https://prnt.sc/DtiJr5W178_g

Here is my full code -

// Callback function for Metabox
<?php
function meta_box_content_footer( $post ) {
    global $post;

    ?>

    <form action="" method="post">

        <div class='event-data-content'>
            <div class="contain1" style="width:50%; float:left;">

                <?php

                // Save Post Meta
                add_action( 'save_post', 'save_metabox' );

                function save_metabox() {
                    global $post;

                    if ( isset( $_POST["custom_element_grid_class"] ) ) {
                        //UPDATE: 
                        $meta_element_class = $_POST['custom_element_grid_class'];
                        //END OF UPDATE

                        update_post_meta( $post->ID, 'custom_element_grid_class_meta_box', $meta_element_class );

                    }

                }
                
                // Function for organizer section
                function custom_element_grid_class_meta_box( $post ) {
                    global $wpdb;
                    global $post;
                    $meta_element_class = get_post_meta( $post->ID, 'custom_element_grid_class_meta_box', true );
                    ?>

                    <div class="full-area">
                        <label class="label0" for="cars">Organizer:</label>
                        <select class="js-example-basic-multiple" id="select-or" multiple="multiple"
                                name="custom_element_grid_class" id="custom_element_grid_class">

                            <?php

                            $organizer_query = "SELECT post_title FROM wp_posts WHERE post_type='event_organizer' AND post_status='publish'";
                            $results         = $wpdb->get_results( $organizer_query );

                            foreach ( $results as $result ) {

                                ?>
                                <option value="" name="custom_element_grid_class">
                                    <?php echo $result->post_title ?>
                                </option>
                                <?php

                            }
                            ?>
                        </select>
                    </div>
                    <?php

                    var_dump( $post->ID );
                }

                custom_element_grid_class_meta_box( $post );

                // Script for multiselection .....
                ?>
                <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
                <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
                <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>
                <script>
                    $(document).ready(function () {
                        $('.js-example-basic-multiple').select2();
                    });
                </script>

            </div>
        </div>

    </form>
    
    <?php
}

I have shown option's value using foreach loop. I have added a custom post type for organizer where admin can add organizer and that values (The title of of the organize's post) are basically being shown as option's value using foreach loop. The problem is those option's values are not being updated or saved in database. Please suggest.... Thanks, Mani

2
  • Thanks vancoder! So here is your code I just applied docs.google.com/document/d/… But the organizer posts are not coming as the option's value from foreach loop. I am getting it empty prnt.sc/i7b3MUAEqSsc And I see there is not column being created in database prnt.sc/OX2kr9JWdOWX Mar 24, 2023 at 19:36
  • But when I remove this variable $selected = in_array( $result->post_title, $var_to_get_post_meta ) ? 'selected' : ''; the values from foreach loop are shown but they are not being updated... Mar 24, 2023 at 20:13

1 Answer 1

0

The code has a few issues:

The add_action() function to save the post meta should not be placed inside the callback function meta_box_content_footer(). Instead, it should be called outside of any functions, preferably in the main plugin file or in the functions.php file of your theme.

There are two id attributes assigned to the select element: id="select-or" and id="custom_element_grid_class". It's not recommended to have multiple id attributes with the same value on the same page.

The name attribute is assigned to the option element instead of the select element. The name attribute should be assigned to the select element instead.

The value attribute of the option element is empty, which means the selected value will not be passed to the server when the form is submitted. The value attribute should be set to the post title or any other identifier that you want to save as post meta.

Here's the corrected code:

<?php
// Callback function for Metabox
function meta_box_content_footer( $post ) {
    global $wpdb;
    $meta_element_class = get_post_meta( $post->ID, 'custom_element_grid_class_meta_box', true );
    ?>

    <div class='event-data-content'>
        <div class="contain1" style="width:50%; float:left;">
            <form action="" method="post">
                <div class="full-area">
                    <label class="label0" for="custom_element_grid_class">Organizer:</label>
                    <select class="js-example-basic-multiple" id="custom_element_grid_class" name="custom_element_grid_class[]" multiple>
                        <?php
                        $organizer_query = "SELECT post_title FROM wp_posts WHERE post_type='event_organizer' AND post_status='publish'";
                        $results = $wpdb->get_results( $organizer_query );

                        foreach ( $results as $result ) {
                            $selected = in_array( $result->post_title, $meta_element_class ) ? 'selected' : '';
                            ?>
                            <option value="<?php echo $result->post_title ?>" <?php echo $selected ?>>
                                <?php echo $result->post_title ?>
                            </option>
                            <?php
                        }
                        ?>
                    </select>
                </div>

                <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
                <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
                <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet"/>

                <script>
                    $(document).ready(function () {
                        $('.js-example-basic-multiple').select2();
                    });
                </script>
            </form>
        </div>
    </div>
    <?php
}

Remember to call the add_action() function outside of this callback function to save the post meta.

Your Answer

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

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