Question

I'm trying to create a custom meta box with multiple text fields. The idea is that there is initially one text box, then you can click the button 'Add New' and a another text box is added (using Ajax; no need to publish or update the post for the text box to be created). I'm using the following code (below), but it just doesn't work. I'm completely stuck; really need some help. I'm even willing to donate some cash if anyone can help me figure this out.

http://pastebin.com/usRhiJJ4

Was it helpful?

Solution

If you end goal is to add text boxes dynamically, but still require the user to save/update the post, you don't need to use AJAX at all.

Just name the text fields appropriately so an array of values is POSTed, then handle it in your save action.

It may be helpful to save this array in a single post meta key, so you can just loop through it to output the meta box.

Give an ID to the enclosing <div>, something like 'slideshow_metabox'

Set your initial text boxes as so:

<input type="text" style="position: relative; right: 0; width: 85%;" name="slideshow[]" value="<?php echo $value; ?>" />

And change your 'add button' onclick to be:

function() {
    jQuery('#slideshow_metabox').append('<input type="text" style="position: relative; right: 0; width: 85%;" name="slideshow[]" value="" />');
}

Hope this helps.

OTHER TIPS

Here's a script I wrote that I've used in 5-6 custom different types of meta boxes. I love having the add/remove fields option, makes things much faster since WP can be very slow when you save/publish posts, even tho it could just post to the admin-ajax.php file in the background and be much faster.

http://new2wp.com/snippet/jquery-add-remove-extra-input-form-fields/

Licensed under: CC-BY-SA with attribution
Not affiliated with wordpress.stackexchange
scroll top