title: collection Field Type not creating form elements
body: <p>I'm trying to create a form which will add a new text box every time the 'Add new box' link got clicked.
  I read through the following example.
  <a href="http://symfony.com/doc/current/reference/forms/types/collection.html" rel="nofollow">http://symfony.com/doc/current/reference/forms/types/collection.html</a></p>
  
  <p>Basically I was following the example from the book. But when the page is rendered and I click on the link nothing happens.
  Any thoughts?
  Thanks.</p>
  
  <p>This is my controller.</p>
  
  <pre><code> public function createAction() {
      $formBuilder = $this-&gt;createFormBuilder();
  
      $formBuilder-&gt;add('emails', 'collection', array(
          // each item in the array will be an "email" field
          'type'   =&gt; 'email',
          'prototype' =&gt; true,
          'allow_add' =&gt; true,
          // these options are passed to each "email" type
          'options'  =&gt; array(
              'required'  =&gt; false,
              'attr'      =&gt; array('class' =&gt; 'email-box')
          ),
      ));
      $form = $formBuilder-&gt;getForm();
  
      return $this-&gt;render('AcmeRecordBundle:Form:create.html.twig', array(
          'form' =&gt; $form-&gt;createView(),
      ));
  }
  </code></pre>
  
  <p>This is the view.</p>
  
  <pre><code> &lt;form action="..." method="POST" {{ form_enctype(form) }}&gt;
  {# store the prototype on the data-prototype attribute #}
  &lt;ul id="email-fields-list" data-prototype="{{ form_widget(form.emails.get('prototype')) | e }}"&gt;
  {% for emailField in form.emails %}
      &lt;li&gt;
          {{ form_errors(emailField) }}
          {{ form_widget(emailField) }}
      &lt;/li&gt;
  {% endfor %}
  &lt;/ul&gt;
  
  &lt;a href="#" id="add-another-email"&gt;Add another email&lt;/a&gt;
  &lt;/form&gt;
  
  &lt;script type="text/javascript"&gt;
  // keep track of how many email fields have been rendered
  var emailCount = '{{ form.emails | length }}';
  
  jQuery(document).ready(function() {
      jQuery('#add-another-email').click(function() {
          var emailList = jQuery('#email-fields-list');
  
          // grab the prototype template
          var newWidget = emailList.attr('data-prototype');
          // replace the "$$name$$" used in the id and name of the prototype
          // with a number that's unique to our emails
          // end name attribute looks like name="contact[emails][2]"
          newWidget = newWidget.replace(/\$\$name\$\$/g, emailCount);
          emailCount++;
  
          // create a new list element and add it to our list
          var newLi = jQuery('&lt;li&gt;&lt;/li&gt;').html(newWidget);
          newLi.appendTo(jQuery('#email-fields-list'));
  
          return false;
      });
  })
  &lt;/script&gt;
  </code></pre>