Last active
January 26, 2026 18:45
-
-
Save akshuvo/d3c031bbb2fe89670e70fd3630705cf3 to your computer and use it in GitHub Desktop.
Creating a “repeater meta-box” without a Plugin in WordPress
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| add_action('admin_init', 'gpm_add_meta_boxes', 2); | |
| function gpm_add_meta_boxes() { | |
| add_meta_box( 'gpminvoice-group', 'Custom Repeatable', 'Repeatable_meta_box_display', 'page', 'normal', 'default'); | |
| } | |
| function Repeatable_meta_box_display() { | |
| global $post; | |
| $gpminvoice_group = get_post_meta($post->ID, 'customdata_group', true); | |
| wp_nonce_field( 'gpm_repeatable_meta_box_nonce', 'gpm_repeatable_meta_box_nonce' ); | |
| ?> | |
| <script type="text/javascript"> | |
| jQuery(document).ready(function( $ ){ | |
| $( '#add-row' ).on('click', function() { | |
| var row = $( '.empty-row.screen-reader-text' ).clone(true); | |
| row.removeClass( 'empty-row screen-reader-text' ); | |
| row.insertBefore( '#repeatable-fieldset-one tbody>tr:last' ); | |
| return false; | |
| }); | |
| $( '.remove-row' ).on('click', function() { | |
| $(this).parents('tr').remove(); | |
| return false; | |
| }); | |
| }); | |
| </script> | |
| <table id="repeatable-fieldset-one" width="100%"> | |
| <tbody> | |
| <?php | |
| if ( $gpminvoice_group ) : | |
| foreach ( $gpminvoice_group as $field ) { | |
| ?> | |
| <tr> | |
| <td width="15%"> | |
| <input type="text" placeholder="Title" name="TitleItem[]" value="<?php if($field['TitleItem'] != '') echo esc_attr( $field['TitleItem'] ); ?>" /></td> | |
| <td width="70%"> | |
| <textarea placeholder="Description" cols="55" rows="5" name="TitleDescription[]"> <?php if ($field['TitleDescription'] != '') echo esc_attr( $field['TitleDescription'] ); ?> </textarea></td> | |
| <td width="15%"><a class="button remove-row" href="#1">Remove</a></td> | |
| </tr> | |
| <?php | |
| } | |
| else : | |
| // show a blank one | |
| ?> | |
| <tr> | |
| <td> | |
| <input type="text" placeholder="Title" title="Title" name="TitleItem[]" /></td> | |
| <td> | |
| <textarea placeholder="Description" name="TitleDescription[]" cols="55" rows="5"> </textarea> | |
| </td> | |
| <td><a class="button cmb-remove-row-button button-disabled" href="#">Remove</a></td> | |
| </tr> | |
| <?php endif; ?> | |
| <!-- empty hidden one for jQuery --> | |
| <tr class="empty-row screen-reader-text"> | |
| <td> | |
| <input type="text" placeholder="Title" name="TitleItem[]"/></td> | |
| <td> | |
| <textarea placeholder="Description" cols="55" rows="5" name="TitleDescription[]"></textarea> | |
| </td> | |
| <td><a class="button remove-row" href="#">Remove</a></td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| <p><a id="add-row" class="button" href="#">Add another</a></p> | |
| <?php | |
| } | |
| add_action('save_post', 'custom_repeatable_meta_box_save'); | |
| function custom_repeatable_meta_box_save($post_id) { | |
| if ( ! isset( $_POST['gpm_repeatable_meta_box_nonce'] ) || | |
| ! wp_verify_nonce( $_POST['gpm_repeatable_meta_box_nonce'], 'gpm_repeatable_meta_box_nonce' ) ) | |
| return; | |
| if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) | |
| return; | |
| if (!current_user_can('edit_post', $post_id)) | |
| return; | |
| $old = get_post_meta($post_id, 'customdata_group', true); | |
| $new = array(); | |
| $invoiceItems = $_POST['TitleItem']; | |
| $prices = $_POST['TitleDescription']; | |
| $count = count( $invoiceItems ); | |
| for ( $i = 0; $i < $count; $i++ ) { | |
| if ( $invoiceItems[$i] != '' ) : | |
| $new[$i]['TitleItem'] = stripslashes( strip_tags( $invoiceItems[$i] ) ); | |
| $new[$i]['TitleDescription'] = stripslashes( $prices[$i] ); // and however you want to sanitize | |
| endif; | |
| } | |
| if ( !empty( $new ) && $new != $old ) | |
| update_post_meta( $post_id, 'customdata_group', $new ); | |
| elseif ( empty($new) && $old ) | |
| delete_post_meta( $post_id, 'customdata_group', $old ); | |
| } |
Well, since I have to insert into db a volume of more than 5000 data, I would have liked to avoid the laborious steps of print_r() and echo for each of the single meta_values of the multidimensional array.. but since nobody here answers (apart from old mentions to xml that do not apply to me), I fear that nobody knows of a simpler alternative way .. Or it's a dormant conversation.
Thanks anyway, I'll get by.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hi, I am working to a different method which creates multiple separated strings of meta keys and related values.
I also studied your code, which is very interesting, but with the nonscalar array the result is serialized by WP.
Tested trying to add unserialize() or the wp maybe_unserialize() but it doesn't work. How do you extract and split data to be used in front-end? Query?