Saving meta box data from selected option’s value in database is not working

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.