Problems having two different forms in the same twig file

Question

I have been experiencing problems with embedding a controller that creates a form where you can upload files. When the controller is rendered in certain parts of the twig file, I get this error:

An exception has been thrown during the rendering of a template ("Expected argument of type "Symfony\Component\HttpFoundation\File\UploadedFile", "string" given").

This is strange since in other parts of the same twig file, the expected argument is given without problems. The problem seems to be another form in the same twig file that doesn't play nice with my embedded controller form.

The part that seems to cause the problem:

<div id="payment_checkout_form">
    {% if cId and shippingRegionId %}
        {% set savedPath =path('cart_set_shipping', {'store_id': webstore.id, 'shippingRegion': shippingRegionId,'cId':cId}) %}
        {{ form_start(form, {'attr': {'id': 'form_checkout','data-url':savedPath}}) }}
    {% else %}
        {{ form_start(form, {'attr': {'id': 'form_checkout'}}) }}
    {% endif %}
{{ render(url('passport')) }}    

Relevent part of my PassportType:

public function buildForm(FormBuilderInterface $builder, array $options)
{

  $builder
    ->add('file', 'file', array('label' => false) , [
          'multiple' => true,
          'label' => '',
          'attr'  => [
              'accept' => 'image/*',
              'multiple' => 'multiple'
          ]
      ]
    )
    ->add('confirm', 'submit');
}

public function configureOptions(OptionsResolver $resolver){
    $resolver->setDefaults(array(
        'data_class' => 'AppBundle\Entity\Passport',
    ));
}

Relevent part of my Passport entity:

/**
 * @Assert\File(maxSize="6000000")
 */
private $file;

/**
 * Sets file.
 *
 * @param Symfony\Component\HttpFoundation\File\UploadedFile $file
 */
public function setFile(UploadedFile $file = null) {
    $this->file = $file;
}

Relevent part of my Passport controller

/**
* @Route("/passport", name="passport")
*/
public function createPassportAction(Request $request)
{
    $request = $this->get('request_stack')->getMasterRequest();

    $passport = new Passport();
    $passport->setName('default');

    $form = $this->createForm(new PassportType(), $passport);
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
      $files = $request->files->get('passportPhoto');

       if (!empty($files)) {
          $this->uploadFile($files);
       }
    }

    return $this->render('passport.html.twig', [
        'form' => $form->createView(),
        'isFormSubmitted' => $form->isSubmitted(),
        'passportImages' => $this->getDoctrine()->getRepository('AppBundle\Entity\Passport')->findAll(),
    ]);
}

{{ render(url('passport')) }} is the embedded controller that renders the file upload form. If I put the{{ render(url('passport')) }} above the form_start of the other form everything works.

Answer 1

Answering my own question:

embedding a form inside another form like I'm trying to do in the question by using render is not possible. I fixed my problem by first removing the render call of my embedded passport form and making my passport type a sub type of the type that is used in the checkout form like this:

public function buildForm(FormBuilderInterface $builder, array $options){
    $builder
        ...
        ->add('passport', new PassportType(), array(
            'required' => true
        ))
        ...
}

I still wanted to have the controller of the passport part of my form to be in it's own file. To achieve this I called my passport controller inside of the checkout controller using the forward method like this:

$files = $request->files->get('order')['passport_id'];
$store_id = $request->attributes->get('store_id');
$this->forward('AppBundle\Controller\PassportController::uploadFile',
  [ 'files' => $files, 'store_id' => $store_id ]);