Saving repeated option values in a custom query

I have a custom Submenu page with my post type in which I am querying all posts and adding custom textareas and dropdowns that will repeat with each entry. The id and name for each field is the same accept the end of it is hyphenated with the post ID at the end. I want to be able to save the values entered in these fields and preferably once the data is entered instead of clicking a save button.

I figure that these texatareas and dropdowns need to be added into a group in order to save them, but I haven't done it in this fashion before. I usually have the values in the individual post. But, I need this section separate from the actual posts in the post type.

Any suggestions would be helpful. Thanks in advance!!!

Here is what I have so far for this submenu page.

$args = array( 'post_type' = 'properties', 'posts_per_page' = -1, 'orderby' = 'title', 'order' = 'DESC', 'post_status' = 'publish' );

$myposts = get_posts( $args );

?
    div class="wrap"
        h1Status:/h1

        style
            .widefat .room-column {
                width: 3.2em;
                vertical-align: top;
            }
            .widefat textarea {
                width: 100%;
            }
        /style
        form action="" method="post"
            input type="submit" name="update_statuses" value="Update" class="button-primary" /
            table class="wp-list-table widefat fixed striped posts"
                thead
                    tr
                        th class="manage-column column-cb room-column"Beds/th
                        th class="manage-column column-columnname"Address/th
                        th class="manage-column column-columnname"Renewal/th
                        th class="manage-column column-columnname"Future Rent/th
                        th class="manage-column column-columnname"Availability Date/th
                        th class="manage-column column-columnname"Deposit/th
                        th class="manage-column column-columnname"Last Showing/th
                        th class="manage-column column-columnname"Status/th
                        th class="manage-column column-columnname"Date/th
                        th class="manage-column column-columnname"Initials/th
                        th class="manage-column column-columnname"Notes/th
                    /tr
                /thead
            ?php
            $count = 0;
            foreach( $myposts as $post ) : setup_postdata($post);
                $count++;
                $bedrooms = wp_get_post_terms($post-ID, 'bedrooms', array("fields" = "all"));
                foreach( $bedrooms as $room ) { 
                    $bedSlug = $room-slug;
                }
                $bedStripped = preg_replace('/[^0-9]/', '', $bedSlug);
                ?
                tr
                    th class="room-column"
                        ?php echo $bedStripped; ?
                    /th
                    td
                        a href="?php the_permalink(); ?" target="_blank"?php the_title(); ?/a
                    /td
                    td
                        select name="renewal-?php echo $post-ID; ?" id="renewal-?php echo $post-ID; ?"
                            option value="0"Choose/option
                            option value="No"No/option
                            option value="Yes"Yes/option
                        /select
                    /td
                    td
                        textarea name="future-rent-?php echo $post-ID; ?" id="future-rent-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        textarea name="available-?php echo $post-ID; ?" id="available-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        textarea name="deposit-?php echo $post-ID; ?" id="deposit-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        textarea name="last-showing-?php echo $post-ID; ?" id="last-showing-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        select name="status-?php echo $post-ID; ?" id="status-?php echo $post-ID; ?"
                            option value="--"-/option
                            option value="nf"Needs Fees/option
                            option value="bgi"BGI/option
                            option value="fa"Final Approval/option
                            option value="a"Approved/option
                            option value="nd"Need Deposit/option
                            option value="dp"Deposit Paid/option
                            option value="ats"Appt to Sign/option
                            option value="rnl"Renew Lease/option
                            option value="ls"Lease Signed/option
                        /select
                    /td
                    td
                        textarea name="date-?php echo $post-ID; ?" id="date-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        textarea name="initials-?php echo $post-ID; ?" id="initials-?php echo $post-ID; ?"/textarea
                    /td
                    td
                        textarea name="notes-?php echo $post-ID; ?" id="notes-?php echo $post-ID; ?"/textarea
                    /td
                /tr
                ?php
            endforeach;
            echo 'div style="float:right;"Total: '.$count.'/div';
            ?
            /table
            input type="submit" name="update_statuses" value="Update" class="button-primary" /
        /form

    /div

Topic autosave custom-field customization custom-post-types Wordpress

Category Web


In this scenario I prefer to use AJAX, you save each value when you modify it and you don't need a click button.

You need:

  • Print the post ID only once for each row
  • A JavaScript file capturing your changes and sending it to admin-ajax.php
  • An action hook to declare the function that handle the ajax post

I make a sample plugin for you with a normal post and only editing a field

<?php
/**
* Plugin Name:  KFP Ajax Update
* Description:  Probando a actualizar campos con Ajax
* Version:      0.1.1
* Author:       Juanan Ruiz
* Author URI:   https://kungfupress.com/
*/

// Admin menu
add_action("admin_menu", "Kfp_Ajax_Update_menu");

// Links the hook to the function that handles the ajax post update
add_action('wp_ajax_kfp_ajax_update', 'Kfp_Ajax_update');

/**
 * Add the admin menu 
 *
 * @return void
 */
function Kfp_Ajax_Update_menu()
{
    add_menu_page("Formulario Ajax Update", "Ajax Update", "manage_options",
        "kfp_ajax_update_menu", "Kfp_Ajax_Update_admin", "dashicons-feedback", 45);
}

 /**
 * Create the admin page where you show and edit your data
 *
 * @return void
 */
 function Kfp_Ajax_Update_admin()
 {

     wp_enqueue_script('kfp-ajax-update', plugins_url('/js/ajax-update.js', __FILE__));
     wp_localize_script('kfp-ajax-update', 'ajax_object', array(
         'ajax_url' => admin_url('admin-ajax.php'),
         'ajax_nonce' => wp_create_nonce('ajax_update_' . admin_url('admin-ajax.php')),
     ));
     $args = array( 'post_type' => 'post', 'posts_per_page' => -1, 'orderby' =>               
    'title', 'order' => 'DESC', 'post_status' => 'publish' );
    $myposts = get_posts( $args );

    $html = '<div class="wrap"><h1>Ajax Update</h1>';
    $html .= '<table class="wp-list-table widefat fixed striped posts">';
    $html .= '<thead><tr>';
    $html .= '<th class="manage-column column-columnname"  width="30%">Title</th>';
    $html .= '<th class="manage-column column-columnname">Excerpt</th>';
    $html .= '</tr></thead><tbody>';
    foreach($myposts as $post) {
        $html .= "<tr data-post_id='$post->ID'>";
        $html .= "<td>$post->post_title</td>";
        $html .= "<td><textarea class='auto-update' style='width:100%;'>$post->post_excerpt</textarea></td>";
        $html .= "</tr>";
    }
    $html .= '</tbody></table></div>';
    echo $html;
}

/**
 * Handle ajax post
 *
 * @return void
 */
function Kfp_Ajax_update() 
    {
    if ( defined('DOING_AJAX') && DOING_AJAX
        && wp_verify_nonce($_POST['nonce'], 'ajax_update_' . admin_url( 'admin-ajax.php'))) {
        $args = array(
            'ID' => $_POST['post_id'],
            'post_excerpt' => $_POST['post_excerpt']
        );
        wp_update_post($args);
        echo "Ok";
        die();
    } else {
        die('Error');
    }
}

And the javascript file (js/ajax-update.js:

jQuery(document).ready(function($){
    $('.auto-update').blur(function(event){
        $.post(ajax_object.ajax_url, 
            {
                action:'kfp_ajax_update', 
                post_id:$(this).parents('tr').data('post_id'),
                post_excerpt: $(this).val(),
                nonce: ajax_object.ajax_nonce
            }, 
            function(response) {
                return true;
            });
        return false;
    });
});

I put the code in https://github.com/kungfupress/kfp-ajax-update


If I understood you correctly, you're basically asking how to group inputs by post ID? If this is the case, you could do something like this

// group by input
name="renewal[<?php echo $post->ID; ?>]"    
// when saving
$_POST['renewal'] // array of input values with each having post_id as key

Or

// group by post ID
name="data[<?php echo $post->ID; ?>][renewal/future-rent/etc.]"    
// when saving
$_POST['data'] // array of arrays, each with post_id as key. post_id specific subarrays have input names as keys and input values as values

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.