我试图在wordpress管理中创建一个动态表单,在这里我可以添加一行,并且仍然能够将变量作为post meta处理到数据库中。我做了很多研究,尝试了几种方法,但似乎都没能奏效。我这里有一个代码示例来展示我是如何处理信息的,我只需要弄清楚如何循环浏览动态内容,然后根据需要适当地更新或删除它。
<?php
// Set Up Meta Boxes
function add_invoice_meta_boxes() {
add_meta_box(\'invoice_meta_box\', \'Invoice Summary\', \'setup_invoice_meta_box\', \'invoice\', \'normal\', \'high\');
}
add_action(\'add_meta_boxes\', \'add_invoice_meta_boxes\');
// Invoice Meta Box
function setup_invoice_meta_box($post) {
echo \'<input type="hidden" name="invoice_meta_box_nonce" value="\'. wp_create_nonce(\'invoice_meta_box\'). \'" />\';
?>
<script language="javascript">function addRow(tableID){var table=document.getElementById(tableID);var rowCount=table.rows.length;var row=table.insertRow(rowCount);var colCount=table.rows[0].cells.length;for(var i=0;i<colCount;i++){var newcell=row.insertCell(i);newcell.innerHTML=table.rows[0].cells[i].innerHTML;switch(newcell.childNodes[0].type){case"text":newcell.childNodes[0].value="";break;case"checkbox":newcell.childNodes[0].checked=false;break;case"select-one":newcell.childNodes[0].selectedIndex=0;break;}}}
function deleteRow(tableID){try{var table=document.getElementById(tableID);var rowCount=table.rows.length;for(var i=0;i<rowCount;i++){var row=table.rows[i];var chkbox=row.cells[0].childNodes[0];if(null!=chkbox&&true==chkbox.checked){if(rowCount<=1){alert("Cannot delete all the rows.");break;}
table.deleteRow(i);rowCount--;i--;}}}catch(e){alert(e);}}</script>
<?php } ?>
<div class="wrap">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
</tr>
<tr>
<td>
<input type="button" value="Add Row" onclick="addRow(\'dataTable\')">
<input type="button" value="Delete Row" onclick="deleteRow(\'dataTable\')">
</td>
</tr>
<tr>
<td>
<table>
<tr>
<th width="20px"> </th>
<th width="202px">Product</th>
<th width="252px">Description</th>
<th width="52px">QTY</th>
<th width="102px">Price</th>
<th width="102px">Tax</th>
<th width="202px">Amount</th>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table id="dataTable">
<tr>
<td><input type="checkbox" class="gho-chk" name="chk"></td>
<td><input type="text" class="gho-description" name="product[]" value="<?php echo get_post_meta($post_>ID, \'product[]\', true); ?>" /></td>
<td><input type="text" class="gho-description" name="description[]" value="<?php echo get_post_meta($post_>ID, \'description[]\', true); ?>" /></td>
<td><input type="text" class="gho-qty" name="qty[]" value="<?php echo get_post_meta($post_>ID, \'qty[]\', true); ?>" /></td>
<td><input type="text" class="gho-price" name="price[]" value="<?php echo get_post_meta($post_>ID, \'price[]\', true); ?>" /></td>
<td><input type="text" class="gho-tax" name="tax[]" value="<?php echo get_post_meta($post_>ID, \'tax[]\', true); ?>" /></td>
<td><input type="text" class="gho-amount" name="amount[]" value="<?php echo get_post_meta($post_>ID, \'amount[]\', true); ?>" /></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<?php
function save_invoice_meta_box($post_id) {
// check nonce
if (!isset($_POST[\'invoice_meta_box_nonce\']) || !wp_verify_nonce($_POST[\'invoice_meta_box_nonce\'], \'invoice_meta_box\')) {
return $post_id;
}
// check capabilities
if (\'invoice\' == $_POST[\'post_type\']) {
if (!current_user_can(\'edit_post\', $post_id)) {
return $post_id;
}
} elseif (!current_user_can(\'edit_page\', $post_id)) {
return $post_id;
}
// exit on autosave
if (defined(\'DOING_AUTOSAVE\') && DOING_AUTOSAVE) {
return $post_id;
}
if(isset($_POST[\'product\'])) {
update_post_meta($post_id, \'product\', $_POST[\'product\']);
} else {
delete_post_meta($post_id, \'product\');
}
}
add_action(\'save_post\', \'save_invoice_meta_box\');
?>
最合适的回答,由SO网友:RiotAct 整理而成
让它工作起来!下面是一个如何设置表单的示例。
<script type="text/javascript">
jQuery(document).ready(function($) {
$(\'.metabox_submit\').click(function(e) {
e.preventDefault();
$(\'#publish\').click();
});
$(\'#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;
});
$(\'#repeatable-fieldset-one tbody\').sortable({
opacity: 0.6,
revert: true,
cursor: \'move\',
handle: \'.sort\'
});
});
</script>
<table id="repeatable-fieldset-one" class="billing-form">
<thead>
<tr>
<th class="bit-5"></th>
<th class="bit-10">SKU</th>
<th class="bit-40">Item</th>
<th class="bit-10">Quantity</th>
<th class="bit-10">Price</th>
<th class="bit-16">Total</th>
<th class="bit-2"></th>
</tr>
</thead>
<tbody>
<?php
if ( $repeatable_fields ) :
foreach ( $repeatable_fields as $field ) {
?>
<tr>
<td class="bit-5"><a class="button remove-row" href="#">-</a></td>
<td class="bit-10"><input type="text" name="order_sku[]" value="<?php if($field[\'order_sku\'] != \'\') echo esc_attr( $field[\'order_sku\'] ); ?>" /></td>
<td class="bit-40"><input type="text" name="order_item[]" value="<?php if($field[\'order_item\'] != \'\') echo esc_attr( $field[\'order_item\'] ); ?>" /></td>
<td class="bit-10"><input type="text" name="order_qty[]" value="<?php if($field[\'order_qty\'] != \'\') echo esc_attr( $field[\'order_qty\'] ); ?>" /></td>
<td class="bit-10"><input type="text" name="order_price[]" value="<?php if($field[\'order_price\'] != \'\') echo esc_attr( $field[\'order_price\'] ); ?>" /></td>
<td class="bit-16"><input type="text" name="order_subtotal[]" value="<?php if($field[\'order_subtotal\'] != \'\') echo esc_attr( $field[\'order_subtotal\'] ); ?>" /></td>
<td class="bit-2"><a class="sort">|||</a></td>
</tr>
<?php
}
else :
// show a blank one
?>
<tr>
<td class="bit-5"><a class="button remove-row" href="#">-</a></td>
<td class="bit-10"><input type="text" name="order_sku[]" /></td>
<td class="bit-40"><input type="text" name="order_item[]" /></td>
<td class="bit-10"><input type="text" name="order_qty[]" /></td>
<td class="bit-10"><input type="text" name="order_price[]" /></td>
<td class="bit-16"><input type="text" name="order_subtotal[]" /></td>
<td class="bit-2"><a class="sort">|||</a></td>
</tr>
<?php endif; ?>
<!-- empty hidden one for jQuery -->
<tr class="empty-row screen-reader-text">
<td class="bit-5"><a class="button remove-row" href="#">-</a></td>
<td class="bit-10"><input type="text" name="order_sku[]" /></td>
<td class="bit-40"><input type="text" name="order_item[]" /></td>
<td class="bit-10"><input type="text" name="order_qty[]" /></td>
<td class="bit-10"><input type="text" name="order_price[]" /></td>
<td class="bit-16"><input type="text" name="order_subtotal[]" /></td>
<td class="bit-2"><a class="sort">|||</a></td>
</tr>
</tbody>
</table>
<p><a id="add-row" class="button" href="#">Add another</a>
<input type="submit" class="metabox_submit" value="Save" />
</p>