0

I have an options page for a plugin and I'm trying to create a repeatable groups of fields. I have the fields and the JS to clone the fields, but I can't get them to save.

/**
 * Add Mimes
 *
 * @since      0.0.1
 * @return     void
 */
public function add_mimes_callback() {
  $option       = $this->ordered_uploads_options;
  $mimes        = $option[OU_PL_PREFIX . '_mimes']; 
  $mime_folders = $this->mime_folders(); 
  ?>
  <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');
        jQuery('input, select', row).val('').attr('name', function(index, name) {
          return name.replace(/(\d+)/, function(fullMatch, n) {
            return Number(n) + 1;
          });
        });
        return false;
      });

      $('.remove-row').on('click', function() {
        $(this).parent().parent().remove();
        return false;
      });
    });
  </script>
  <table id="repeatable-fieldset-one" width="100%">
    <thead>
      <tr>
        <th>Extention</th>
        <th>Filetype</th>
        <th>Folder</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
    <?php
      $counter = 1;
      if( $mimes ) {
        foreach( $mimes as $mime ) {
          $counter++;
          $extention = ( $mime[OU_PL_PREFIX . '_mime_extention']   ? esc_attr( $mime[OU_PL_PREFIX . '_mime_extention'] )   : '' );  
          $filetype  = ( $mime[OU_PL_PREFIX . '_mime_file_type']   ? esc_attr( $mime[OU_PL_PREFIX . '_mime_file_type'] )   : '' );
          $folder    = ( $mime[OU_PL_PREFIX . '_mime_mime_folder'] ? esc_attr( $mime[OU_PL_PREFIX . '_mime_mime_folder'] ) : '' );
          ?>
          <tr>
            <td>
              <input type="text" name="ou_mimes['ou_mime_extention_<?php echo $counter; ?>']" value="<?php echo $extention; ?>" class="all-options">
            </td>
            <td>
              <input type="text" name="ou_mimes['ou_mime_file_type<?php echo $counter; ?>']" class="all-options">
            </td>
            <td>
              <select name="ou_mimes['ou_mime_folder<?php echo $counter; ?>']">
                <?php foreach ( $mime_folders as $label => $value ) : ?>
                  <option value="<?php echo $value; ?>"<?php selected( $field['select'], $value ); ?>><?php echo $label; ?></option>
                <?php endforeach; ?>
              </select>
            </td>
            <td>
              <a class="button remove-row" href="#">Remove</a>
            </td>
          </tr>
          <?php
        }
      } else {
        ?>
        <tr>
          <td>
            <input type="text" name="ou_mimes['ou_mime_extention_<?php echo $counter; ?>']" class="all-options">
          </td>
          <td>
            <input type="text" name="ou_mimes['ou_mime_file_type<?php echo $counter; ?>']" class="all-options">
          </td>
          <td>
            <select name="ou_mimes['ou_mime_folder<?php echo $counter; ?>']">
              <?php foreach ( $mime_folders as $label => $value ) : ?>
                <option value="<?php echo $value; ?>"><?php echo $label; ?></option>
              <?php endforeach; ?>
            </select>
          </td>
          <td>
            <a class="button remove-row" href="#">Remove</a>
          </td>
        </tr>
        <?php
      }
      ?>
      <tr class="empty-row screen-reader-text">
        <td>
          <input type="text" name="ou_mimes['ou_mime_extention_1']" class="all-options">
        </td>
        <td>
          <input type="text" name="ou_mimes['ou_mime_file_type_1']" class="all-options">
        </td>
        <td>
          <select name="ou_mimes['ou_mime_folder_1']">
            <?php foreach ( $mime_folders as $label => $value ) : ?>
              <option value="<?php echo $value; ?>"><?php echo $label; ?></option>
            <?php endforeach; ?>
          </select>
        </td>
        <td>
          <a class="button remove-row" href="#">Remove</a>
        </td>
      </tr>
      <?php
    ?> 
    </tbody>
  </table>
  <p><a id="add-row" class="button" href="#">Add Mime</a></p>
  <?php
} // end mime_repeater
0

Use a html setup similar to the following:

<input name="multi[0]" />
<input name="multi[1]" />
<input name="multi[2]" />
etc..

Please be more specific to get better answers. For example don't paste all your code but just a few snippets of it what are relevant to your question.

1
  • It is similar to that. Funny, most of the time I see complaints that there isn't enough code. Code has been trimmed. – gilgimech Oct 20 '15 at 15:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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