Accepting values from dynamically created form elements with Zend Framework

Question

If this question exists elsewhere on SO please enlighten me, was not having any luck in my searches.

The Dilemma:

I'm building an interface that will enable my wife to upload/manage the photos on her site. To streamline the process - i built a component to duplicate the 'add a photo' form row wherein she would be able to add multiple images at once Like so:

The mark up: (generated by Zend_Form)

<section id="add-photos">
    <form enctype="multipart/form-data" action="/admin/photo/add-photos" method="post">
        <dl class="zend_form">
            <dt id="AddPhotos-label">&#160;</dt>
                <dd id="AddPhotos-element">
                    <fieldset id="fieldset-AddPhotos">
                       <dl> <-- This element is what get's duplicated on the 'add 
                                another image' button -->
                         <input type="hidden" name="id" value="" id="id" />
                         <dt id="image_name-label">
                             <label for="image_name" class="required">Image Name</label>
                         </dt>   
                         <dd id="image_name-element">
                             <input type="text" name="image_name" id="image_name"    
                                 value="" />
                         </dd>
                         <dt id="album_name-label">
                             <label for="album_name" class="required">Album Name</label> 
                         </dt>
                         <dd id="album_name-element">
                              <input type="text" name="album_name" id="album_name" 
                                  value="" />
                         </dd>
                         <dt id="category_name-label">
                              <label for="category_name" class="required">Category 
                                   Name</label>
                         </dt>
                         <dd id="category_name-element">
                               <input type="text" name="category_name"  
                                       id="category_name" value="" />
                         </dd>
                         <dt id="image-label">
                               <label for="image" class="optional">Image:</label>
                         </dt>
                         <dd>
                             <input type="hidden" name="MAX_FILE_SIZE" value="134217728" 
                                  id="MAX_FILE_SIZE" />
                             <input type="file" name="image" id="image" />
                         </dd>
                         <dt id="thumbnail-label">
                             <label for="thumbnail" class="optional">Is Thumbnail?
                             </label>       
                         </dt>
                         <dd id="thumbnail-element">
                             <input type="hidden" name="thumbnail" value="0" />
                             <input type="checkbox" name="thumbnail" id="thumbnail" 
                                 value="1" />
                         </dd>
                         <dt id="AddAnotherPhoto-label">&#160;</dt>
                         <dd id="AddAnotherPhoto-element">
                             <button name="AddAnotherPhoto" id="AddAnotherPhoto"  
                                 type="button">Add Another Photo</button>
                         </dd>
                     </dl>
                 </fieldset>
             </dd>
            <dt id="submit-label">&#160;</dt>
                <dd id="submit-element">
                    <input type="submit" name="submit" id="submit" value="Submit" />
                </dd>
            </dl>
        </form>     
</section>

If the user were to click on the 'AddAnotherPhoto' button, it would add another <dl> inside the <fieldset> . So the structure would become:

<fieldset>
    <dl></dl>
    <dl></dl>
</fieldset>

But, as you would expect with my controller action:

public function addPhotosAction()
{
    $form = new Form_AddPhoto();
    if($this->_request->isPost()){
        if($form->isValid($_POST)){
            $photo_model = new Admin_Model_Photo();

            $photo_model->addPhoto(
                $form->getValue('image_name'),
                $form->getValue('album_name'),
                $form->getValue('category_name'),
                $form->getValue('thumbnail')
            );
        }
    }
    $form->setAction('/admin/photo/add-photos');
    $this->view->form = $form;
}   

It's only capturing one set of elements. So my questions is: how do I capture all incoming elements in a grouped fashion? Is there a way iterate through the request object and call the addPhoto method in the Photo Model for each set?

I tried doing this in on the front-end through an $.ajax() where the iteration was easily executed, however the data was not so easy to pass to the action.

Let me know if there are better ways architecturally to solve this - or perhaps other examples where this is being done.

Thanks, Ken

I had a hard time explaining this so let me know if you need something clarified.

Answer 1

If i where ui would create a subform for each addphoto part. then if u copy it make sure u change the id which it will be grouped with.

With this subform u can then use the following function

$form->setElementsBelongTo(<uniqid>);

This makes it group the elements in the uniqid so u will get all post results.

So your element will have a name that looks like name="test[image_name]"

In your controller u can then user $form->getValues() to get all values of your form then loop that data with a foreach loop