Add a subform to a form with ajax on submit

Question

I read this article: http://www.jeremykendall.net/2009/01/19/dynamically-adding-elements-to-zend-form/

That was very interesting and it works fine.

I need to do the same but with a SubForm. I mean that when a user presses a button, I call, via ajax, an action that adds, attaches and displays a subform to my existing form.

For example:
I have a form where a user must fill in the name and surname of his children, so there is a button "Add Child". When the user presses that button a SubForm should be added to my existing form and displayed. On submit it will validate exactly like the example in that article. The only difference is that in there he just adds a single field. I need to add a SubForm, but in exactly the same way.

I tried the following in my action ( called by Ajax ):

public function clonerecursivegroupAction()
{
    $this->_helper->layout->disableLayout();
    $ajaxContext = $this->_helper->getHelper('AjaxContext');
    $ajaxContext->addActionContext('clonerecursivegroup', 'html')->initContext();

    $id = $this->_getParam('id', null);

    $subform1 = new Zend_Form_SubForm();

    $Element1 = $subform1->createElement('text', 'text1');
    $Element1->setLabel('text1')->setRequired(true);
    $Element2 = $subform1->createElement('text', 'text2');
    $Element2->setLabel('text2')->setRequired(false);

    $subform1->addElement($Element1);
    $subform1->addElement($Element2);

    $this->view->field = $subform1->__toString();
}

This almost works.
The view of this action returns the html code of the SubForm, so on success of my ajax call I just display it.

The problem is that on submit it validates the form but it has lost the new subform just added. That does not happen in the article with just one element. I think I just need to add the SubForm to the existing Form, but how?

Answer 1

Add a prefix of the subform to the subform elements. I used the prefix "child" to represent the subforms. Each subform will be created as child1, child2 and so on.

public function clonerecursivegroupAction()
{
       //.. Other code

        $subform = new Zend_Form_SubForm();
    $subform->setIsArray(true);
    $subform->setName("child$id");
    $Element1 = $subform->createElement('text', "newfield$id");
    $Element1->setLabel("newfield$id")
             ->setRequired(true);
    $subform->addElement($Element1);

    $Element1 = $subform->createElement('text', "nextfield$id");
    $Element1->setLabel("nextfield$id")
             ->setRequired(true);

    $subform->addElement($Element1);

    $this->view->field = $subform; 
 // Rest of your statements

}

Then, in the preValidation function, filter the subforms using the subform prefix, instead of the field name:

   public function preValidation(array $data) {
         // array_filter callback
        function findForms($field) {
         // return field names that include 'child'
          if (strpos($field, 'child') !== false) {
               return $field;
           }
         }

      $subForms = array_filter(array_keys($data), 'findForms'); //filter the subform elements

      $children = array();
      foreach ($subForms as $subform) {

          if (is_array($data[$subform])) { 
        $children[$subform] = $data[$subform];
      }

       }

       //Iterate the children
       foreach ($children as $key => $fields) { //$key = subformname, $field=array containing fiend names and values

       // strip the id number off of the field name and use it to set new order
       $order = ltrim($key, 'child') + 2;
       $this->addNewForm($key, $fields, $order);
     }

}

Add New Form function creates each of the sub forms and attaches to the main form:

     public function addNewForm($form, $elements, $order) {

            $subform = new Zend_Form_SubForm();
    $subform->setIsArray(true);
    foreach ($elements as $key => $el) {
          $Element1 = $subform->createElement('text', $key);
              $Element1->setLabel($form.$key)
             ->setValue($el)
                 ->setRequired(true);
                   $subform->addElement($Element1);
    }
        $this->addSubForm($subform, $form, $order);

    }

[EDIT] Using setIsArray for a subform creates each element of the subform as an array element. It simplifies the preValidate function. Edited the code to utilize this feature.

See the complete code in pastebin

Here is another solution using belongsTo, providing array notation to the sub form elements : http://www.stephenrhoades.com/?p=364