Symfony2,上传新图像或选择现有图像(后台)

I am new to the forum, so I'll do my best to respect the forum rules and be clear.

I started with symfony and I am discovering forms and entities, and their use. I would like to display a form that prompts the user to add a new image or select an existing image.

I have two entities, an entity "page" and an entity "image". In the form of adding a page I would like to have a nested to add a picture and a drop-down list to select an image form.

After a few hours of research and testing I'm still facing the same problem and I do not know how to solve it.

Can anyone help me or tell me how I should proceed?

Thank you.

EDIT

Oh i'm sorry it wasn't my intention Udan.

Here is the code for my entity "page":

<?php

namespace Test\AdminBundle\Entity;

use Doctrine\ORM\Mapping as ORM;

/**
 * Pages
 *
 * @ORM\Table(name="app_pages")
 * @ORM\Entity
 */
class Pages
{
/**
 * @var integer
 *
 * @ORM\Column(name="id", type="integer")
 * @ORM\Id
 * @ORM\GeneratedValue(strategy="AUTO")
 */
private $id;

/**
 * @var string
 *
 * @ORM\Column(name="title", type="string", length=90, nullable=true)
 */
private $title;

/**
 * @var string
 *
 * @ORM\Column(name="page_title", type="string", length=90)
 */
private $pageTitle;

/**
 * @var string
 *
 * @ORM\Column(name="page_name", type="string", length=90)
 */
private $pageName;

/**
 * @var string
 *
 * @ORM\Column(name="content", type="text", nullable=true)
 */
private $content;

/**
 * @ORM\OneToOne(targetEntity="Test\AdminBundle\Entity\Image", cascade={"persist"})
 * @ORM\JoinColumn(nullable=false)
 */
private $image;


/**
 * Get id
 *
 * @return integer 
 */
public function getId()
{
    return $this->id;
}

/**
 * Set title
 *
 * @param string $title
 * @return Pages
 */
public function setTitle($title)
{
    $this->title = $title;

    return $this;
}

/**
 * Get title
 *
 * @return string 
 */
public function getTitle()
{
    return $this->title;
}

/**
 * Set pageTitle
 *
 * @param string $pageTitle
 * @return Pages
 */
public function setPageTitle($pageTitle)
{
    $this->pageTitle = $pageTitle;

    return $this;
}

/**
 * Get pageTitle
 *
 * @return string 
 */
public function getPageTitle()
{
    return $this->pageTitle;
}

/**
 * Set pageName
 *
 * @param string $pageName
 * @return Pages
 */
public function setPageName($pageName)
{
    $this->pageName = $pageName;

    return $this;
}

/**
 * Get pageName
 *
 * @return string 
 */
public function getPageName()
{
    return $this->pageName;
}

/**
 * Set content
 *
 * @param string $content
 * @return Pages
 */
public function setContent($content)
{
    $this->content = $content;

    return $this;
}

/**
 * Get content
 *
 * @return string 
 */
public function getContent()
{
    return $this->content;
}

/**
 * Set image
 *
 * @param \Test\AdminBundle\Entity\Image $image
 * @return Pages
 */
public function setImage(\Test\AdminBundle\Entity\Image $image = null)
{
    $this->image = $image;

    return $this;
}

/**
 * Get image
 *
 * @return \Test\AdminBundle\Entity\Image 
 */
public function getImage()
{
    return $this->image;
}
}

Here is the code for my entity "image":

<?php

namespace Test\AdminBundle\Entity;

use Symfony\Component\HttpFoundation\File\UploadedFile;
use Doctrine\ORM\Mapping as ORM;
use Symfony\Component\Validator\Constraints as Assert;

/**
 * Group
 *
 * @ORM\Table(name="app_images")
 * @ORM\Entity
 * @ORM\HasLifecycleCallbacks
 */
class Image
{
/**
 * @var integer
 *
 * @ORM\Column(name="id", type="integer")
 * @ORM\Id
 * @ORM\GeneratedValue(strategy="AUTO")
 */
private $id;

/**
 * @var string
 *
 * @ORM\Column(name="name", type="string", length=255)
 * @Assert\NotBlank
 */
private $name;

/**
 * @var string
 *
 * @ORM\Column(name="alt", type="string", length=255)
 */
private $alt;

/**
 * @var string
 *
 * @ORM\Column(name="path", type="string", length=255, nullable=true)
 */
private $path;

/**
 * @Assert\Image(maxSize="2M")
 */
private $file;

/**
 * Get id
 *
 * @return integer 
 */
public function getId()
{
    return $this->id;
}

/**
 * Set name
 *
 * @param string $name
 * @return Image
 */
public function setName($name)
{
    $this->name = $name;

    return $this;
}

/**
 * Get name
 *
 * @return string 
 */
public function getName()
{
    return $this->name;
}

/**
 * Set file.
 *
 * @param UploadedFile $file
 * @return Image
 */
public function setFile(UploadedFile $file = null)
{
    $this->file = $file;
    // check if we have an old image path
    if ( isset($this->path) ) {
        // store the old name to delete after the update
        $this->temp = $this->path;
        $this->path = null;
    } 
    else {
        $this->path = 'initial';
    }

    return $this;
}

/**
 * Get file.
 *
 * @return UploadedFile
 */
public function getFile()
{
    return $this->file;
}

/**
 * @ORM\PrePersist()
 * @ORM\PreUpdate()
 */
public function preUpload()
{
    if (null !== $this->getFile()) {
        // do whatever you want to generate a unique name
        $filename = sha1(uniqid(mt_rand(), true));
        $this->path = $filename.'.'.$this->getFile()->guessExtension();
    }
}   

/**
 * @ORM\PostPersist()
 * @ORM\PostUpdate()
 */
public function upload()
{
    if (null === $this->getFile()) {
        return;
    }

    // if there is an error when moving the file, an exception will
    // be automatically thrown by move(). This will properly prevent
    // the entity from being persisted to the database on error
    $this->getFile()->move($this->getUploadRootDir(), $this->path);

    // check if we have an old image
    if (isset($this->temp)) {
        // delete the old image
        unlink($this->getUploadRootDir().'/'.$this->temp);
        // clear the temp image path
        $this->temp = null;
    }
    $this->file = null;
}

/**
 * @ORM\PostRemove()
 */
public function removeUpload()
{
    if ($file = $this->getAbsolutePath()) {
        unlink($file);
    }
}

public function getAbsolutePath()
{
    return null === $this->path
        ? null
        : $this->getUploadRootDir().'/'.$this->path;
}

public function getWebPath()
{
    return null === $this->path
        ? null
        : $this->getUploadDir().'/'.$this->path;
}

protected function getUploadRootDir()
{
    // the absolute directory path where uploaded
    // images should be saved
    return __DIR__.'/../../../../web/'.$this->getUploadDir();
}

protected function getUploadDir()
{
    // get rid of the __DIR__ so it doesn't screw up
    // when displaying uploaded doc/image in the view.
    return 'uploads/images';
}

/**
 * Set alt
 *
 * @param string $alt
 * @return Image
 */
public function setAlt($alt)
{
    $this->alt = $alt;

    return $this;
}

/**
 * Get alt
 *
 * @return string 
 */
public function getAlt()
{
    return $this->alt;
}

/**
 * Set path
 *
 * @param string $path
 * @return Image
 */
public function setPath($path)
{
    $this->path = $path;

    return $this;
}

/**
 * Get path
 *
 * @return string 
 */
public function getPath()
{
    return $this->path;
} 
}

The pagesType (buildForm function):

public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('title', 'text', array('required' => false))
        ->add('pageTitle', 'text')
        ->add('pageName', 'text')
        ->add('content', 'textarea', array('required' => false))
        ->add('comment', 'text', array('required' => false))
        /* Add new image */
        ->add('image', new ImageType())
        /* Select an existing image */
        /*->add('image', 'entity', array(
            'class' => 'TestAdminBundle:Image',
            'property' => 'name',
            'multiple' => false
        ))*/
    ;
}

For now I can put a nested form or a drop down list. Except that I would have both.

I thought of adding "temporary" variables (variables that i will not persist) in my entity "page" and whichever one I filled I would put it in the variable image. But I do not know how I'm going to take. I work on it.

I hope someone could help me and I'm sorry for my bad English.

What you need is to use a bundle for image uploads. I use Sonata Media Bundle for backends development but there are others for doing what you need.

I think the best way to go for this is to add a text field instead of the one for the upload and attach a javascript widget from which you would be able to upload or select existing files. On select it would populate the text field with the path to the selected file.